# Укорачиватель Цветов Сократить 6-значные HEX коды до 3-значных (например, #FFFFFF в #FFF) > Каноническая страница: https://elysiatools.com/ru/tools/color-shortener - **Категория:** Design - **Ключевые слова:** hex, цвет, сократить, сжать, аббревиатура, оптимизировать, css, веб, шестнадцатеричный ## Обзор Укорачиватель Цветов — это простой и эффективный инструмент для оптимизации вашего CSS-кода, позволяющий автоматически преобразовывать 6-значные HEX-коды в их компактные 3-значные аналоги, где это возможно. ## Входные данные - **HEX цвета** (textarea): Enter HEX colors, one per line: #FFFFFF #000000 #FF0000 #00FF00 #0000FF #123456 abcdef - **Формат вывода** (select) - **Показать несокращаемые цвета** (checkbox): Включить цвета, которые нельзя сократить, с причинами ## Когда использовать - При подготовке CSS-файлов к публикации для уменьшения размера кода. - Когда необходимо привести все цветовые значения в проекте к единому краткому формату. - Для быстрой очистки стилей от избыточных шестнадцатеричных записей. ## Как это работает - Введите список ваших HEX-кодов в поле ввода, размещая каждый цвет с новой строки. - Выберите желаемый формат вывода, например, строчные или заглавные буквы, с символом решетки или без него. - Нажмите кнопку обработки, чтобы получить оптимизированный список сокращенных цветовых значений. ## Сценарии использования - Оптимизация CSS-таблиц стилей для ускорения загрузки веб-страниц. - Приведение цветовой палитры дизайн-системы к лаконичному виду. - Автоматизация подготовки кода перед передачей в продакшн. ## Частые вопросы ### Все ли цвета можно сократить до 3 знаков? Нет, сокращение возможно только для цветов, где каждая пара символов идентична (например, #AABBCC превращается в #ABC). ### Что произойдет, если цвет нельзя сократить? Если включена опция отображения несокращаемых цветов, инструмент выведет их исходное значение и укажет причину, почему сжатие невозможно. ### Поддерживает ли инструмент работу без символа #? Да, вы можете выбрать формат вывода без решетки в настройках, если это требуется для вашего проекта. ### Можно ли обрабатывать несколько цветов одновременно? Да, инструмент поддерживает пакетную обработку: просто вставьте список цветов, разделяя их переносом строки. ### Влияет ли сокращение цвета на его отображение в браузере? Нет, браузеры интерпретируют 3-значные HEX-коды идентично 6-значным, поэтому визуальный результат останется прежним. ## Связанные инструменты - [Конвертер Adobe RGB в HEX](https://elysiatools.com/ru/tools/adobe-rgb-to-hex-converter): Преобразование значений цвета Adobe RGB в формат HEX для веб-дизайна - [Конвертер CMYK в HEX](https://elysiatools.com/ru/tools/cmyk-to-hex-converter): Преобразование значений цвета CMYK в HEX для отображения на экране - [Расширитель Цветов](https://elysiatools.com/ru/tools/color-expander): Расширить 3-значные HEX коды до 6-значных (например, #FFF в #FFFFFF) - [Конвертер HEX в Adobe RGB](https://elysiatools.com/ru/tools/hex-to-adobe-rgb-converter): Преобразование значений цвета HEX в формат Adobe RGB для профессионального дизайна - [Конвертер HEX в CMYK](https://elysiatools.com/ru/tools/hex-to-cmyk-converter): Преобразование значений цвета HEX в CMYK для печати с поддержкой альфа-канала - [Конвертер HEX в HSL](https://elysiatools.com/ru/tools/hex-to-hsl-converter): Преобразование значений цвета HEX в HSL для отображения на экране - [Конвертер HEX в HSV](https://elysiatools.com/ru/tools/hex-to-hsv-converter): Преобразование значений цвета HEX в HSV/HSB для манипуляции цветом - [Конвертер HEX в LAB](https://elysiatools.com/ru/tools/hex-to-lab-converter): Преобразование значений цвета HEX в LAB для управления цветом с поддержкой альфа-канала ## Примеры - [Примеры цветовых кодов](https://elysiatools.com/ru/samples/color-code): Коллекция цветовых кодов в различных форматах (Hex, RGB, HSL, именованные цвета) для тестирования валидации - [Примеры Обработки Изображений Web Python](https://elysiatools.com/ru/samples/web-image-processing-python): Примеры обработки изображений Web Python используя PIL/Pillow включая чтение, сохранение, изменение размера и преобразование формата - [Примеры Обработки Изображений Web Rust](https://elysiatools.com/ru/samples/web-image-processing-rust): Примеры обработки изображений Web Rust включая чтение/запись, масштабирование и преобразование форматов - [Примеры Обработки Изображений Web TypeScript](https://elysiatools.com/ru/samples/web-image-processing-typescript): Примеры обработки изображений Web TypeScript включая чтение/сохранение, масштабирование и конвертацию форматов ## Связанные материалы - [Инструменты перевода цветовых пространств для веба и печати](https://elysiatools.com/ru/hubs/design-convert): Подборка инструментов для перевода цветовых пространств между вебом и печатью в одном хабе. - [Генераторы CSS-эффектов, палитр и дизайн-токенов](https://elysiatools.com/ru/hubs/design-generate): Подборка инструментов для CSS-визуальных эффектов, построения палитр и генерации дизайн-токенов в одном хабе. - [Instrumenty audita web-dostupnosti i proverki chitaemyh cvetov](https://elysiatools.com/ru/hubs/web-accessibility-audits): Proveryayte problemy WCAG, porjadok chteniya dlya screen reader, oshibki kontrasta, riski dlya narushenij cvetovogo zreniya i dostupnye cvetovye resheniya v odnom hube dlya web-accessibility workflow. - [Инструменты цветового дизайна и преобразования цветовых пространств](https://elysiatools.com/ru/hubs/color-design-tools): Сравнивайте конвертеры цветов, генераторы палитр, инструменты гармонии, проверки доступности и утилиты настройки цвета в одном месте для дизайнеров и разработчиков.