Веб-разработка
Color Converter
Конвертация цвета между HEX, RGB, HSL, HSV/HSB и CMYK — введите значение в любое поле, остальные обновятся мгновенно.
Один и тот же цвет можно записать по-разному в зависимости от контекста: HEX и RGB удобны для кода, HSL — для интуитивного подбора оттенка и яркости, CMYK — для печати. Инструмент конвертирует между всеми форматами одновременно.
Как пользоваться
- Введите значение в любое поле (HEX, RGB, HSL, HSV/HSB или CMYK) — остальные форматы обновятся мгновенно.
- Кнопка «случайный цвет» генерирует произвольный оттенок для быстрого просмотра палитры.
- Скопируйте нужный формат одним нажатием для вставки в CSS или графический редактор.
Когда какой формат использовать
- HEX — компактная запись для CSS и дизайн-систем (#4453b8).
- RGB — когда нужна прозрачность через rgba() или программная работа с каналами цвета.
- HSL — самый удобный для ручного подбора: легко осветлить или затемнить цвет, меняя лишь один параметр.
- CMYK — для материалов, идущих в печать, где цвета смешиваются субтрактивно, в отличие от аддитивного RGB на экране.
Что стоит помнить
CMYK на экране — лишь приближение: точный вид цвета в печати зависит от принтера, бумаги и цветового профиля.
Конвертация между пространствами не всегда точна для крайних (очень насыщенных) цветов из-за разницы в охвате гаммы разных моделей.
Статья об этом инструменте: HEX, RGB, HSL: почему для цвета существует столько записей
Часто задаваемые вопросы
Как конвертер обрабатывает альфа-канал (прозрачность)?
Альфа поддерживается в HEX (#RRGGBBAA), RGBA и HSLA — то, что вы вводите, переносится в другие форматы, поддерживающие прозрачность, тогда как форматы без альфа-канала, как обычный CMYK, просто игнорируют её.
Почему значение немного меняется после конвертации в CMYK и обратно в HEX?
CMYK — это модель, ориентированная на печать, без единой фиксированной формулы для конвертации в/из RGB, поэтому циклическая конвертация может сместить значения на погрешность округления в одну-две единицы; визуально цвет остаётся практически тем же.
Отправляются ли мои данные о цвете куда-либо?
Нет, каждая конвертация происходит локально в вашем браузере с помощью JavaScript — ничего не загружается на сервер.
Чем OKLCH отличается от HSL?
OKLCH описывает цвет через яркость (L), хрому (C) и оттенок (H), но в отличие от HSL учитывает то, как человеческий глаз реально воспринимает яркость — изменение L в OKLCH не искажает воспринимаемую насыщенность цвета, поэтому переходы между оттенками выглядят более равномерными.
Что значит, что цвет «вне гаммы» (out of gamut)?
Некоторые цвета в широких пространствах вроде OKLCH или Display P3 физически не могут быть воспроизведены на дисплеях, поддерживающих только sRGB — браузер в таком случае подставляет ближайший доступный цвет в пределах поддерживаемой гаммы.