Перейти к содержанию

Конвертер цветовых форматов

Преобразуйте один цвет локально между 6-значным HEX (#RRGGBB), RGB, HSL и CMYK с помощью выбора цвета, случайного цвета, живого предпросмотра и настройки каналов; копируйте CSS-значения HEX/RGB/HSL или справочную запись CMYK.

HEX

#

RGB

HSL

CMYK

Конвертер цветовых форматов

Быстрый старт

1
Введите 6-значный HEX или каналы RGB/HSL/CMYK
2
Используйте палитру или случайный цвет и проверьте синхронные значения

Частые сценарии

Дизайн‑handoff

перевести HEX из макетов в CSS‑RGB/HSL

Стайлгайд

унифицировать форматы и запись в библиотеке компонентов

Эталон печати

преобразуйте цвет экрана в CMYK в качестве первой оценки, затем подтвердите его с помощью проверки и рабочего процесса печати.

Доступность

используйте предварительный просмотр только для быстрой визуальной проверки; используйте специальный инструмент контрастирования для точных соотношений

Параметры конверсии и отображения

Правила ввода: HEX поддерживает только 6 цифр (#RRGGBB, без #RGB, #RGBA, #RRGGBBAA или альфа); RGB 0–255; H 0–360; S/L 0–100; CMYK 0–100. Ввод не чувствителен к регистру
Предпросмотр: на компьютере справа показывается живой предпросмотр; на мобильных устройствах используется облегчённый режим без предпросмотра
Выбор цвета: используйте палитру в карточке HEX.
Политика заглавных для HEX: вывод нормализован в верхний регистр (например, #1E90FF); ввод регистронезависимый; тумблера нет
Точная настройка: перетаскивайте буквы каналов влево/вправо (Shift×10, Alt÷0.1)
Копирование: кнопка выдаёт стандартизированные CSS-значения HEX, RGB и HSL (HEX в верхнем регистре) либо справочную запись CMYK cmyk(...)

Рекомендации по использованию

Точность: цветоуправление устройств различается; значения пипетки могут немного расходиться
Альфа: текущие форматы без альфы; используйте rgba()/hsla() или отдельный канал
Цветовое пространство: в вебе — sRGB; в P3/Display‑P3 проверяйте особо тщательно
Единообразие: согласуйте канонический формат в CSS (например, HSL)

Ограничения и совместимость

Различия устройств: мониторы/браузеры/ОС по‑разному управляют цветом; вид может отличаться
CMYK является приблизительным: значения зависят от профилей ICC, бумаги, чернил, устройств и цветопробы; используйте это как ссылку, а не значение, готовое к печати
Нет альфа-канала: этот инструмент не обрабатывает значения прозрачности, rgba(), hsla(), #RGBA или #RRGGBBAA.
Подмножество цветов CSS: именованные цвета, прозрачный, currentColor, HWB, HSV/HSB, Lab, LCH, OKLab, OKLCH, Display-P3, device-cmyk(), относительные цвета, color-mix() и contrast-color() находятся за пределами этого инструмента.
Нет инструментов изображения или палитры: на этой странице не выполняется выборка изображений, экранная пипетка, генерация палитры, генерация градиента, проверка коэффициента контрастности, экспорт переменных CSS или экспорт токенов дизайна.

Конфиденциальность и безопасность

Обработка выполняется в браузере. Текущий цвет может оставаться в текущем сеансе браузера. При сохранении рабочей области или включении WebDAV текущий цвет может быть сохранён или синхронизирован как часть этой области. Производные результаты, история отмены и временные ошибки не сохраняются и не синхронизируются как отдельные данные; инструмент не ведёт список недавних цветов. Эта страница не читает изображения, не снимает образцы с экрана, не загружает URL и не отправляет цвета для преобразования на сервере. На общих устройствах при необходимости удаляйте цвет и данные сайта.

Частые вопросы

5

Перейдите к следующему шагу с этими связанными инструментами.

Вся обработка инструментов выполняется локально в вашем браузере.