Конвертер цветов
Перевод значений между форматами HEX, RGB, HSL и CMYK.
Дизайнер передал макет со значением hsl(174, 62%, 41%), а в таблице стилей используются шестнадцатеричные коды. Типография требует процентные доли CMYK для логотипа, который изначально готовился только в RGB. Все это один и тот же оттенок, записанный по разным правилам.
Характеристики цветовых моделей в конвертере цветов
| Формат | Структура записи | Основное применение |
|---|---|---|
| HEX | #RRGGBB, base-16 | CSS, HTML, графические редакторы |
| RGB | red, green, blue, от 0 до 255 каждый | Экраны, цифровой дизайн |
| HSL | hue, saturation, lightness | Подбор и тонкая настройка палитр |
| CMYK | cyan, magenta, yellow, key (black), % | Печать и полиграфия |
Преимущества формата HSL при подборе оттенков в конвертере цветов
Модели HEX и RGB определяют оттенок через объем красного, зеленого и синего света. Это математически точно, но не всегда наглядно при ручной правке. Глядя на код #2E86AB, сложно сразу сообразить, какие цифры изменить, чтобы сделать тон чуть светлее. HSL распределяет оттенок, насыщенность и светлоту по трем независимым шкалам, поэтому для осветления достаточно лишь увеличить параметр светлоты, не трогая тон и насыщенность.
Большинство генераторов палитр работают именно по такому принципу: ты выбираешь тон на цветовом круге, а затем регулируешь глубину и яркость раздельно. Это соответствует привычному человеческому восприятию цвета, а не аппаратной логике дисплея.
Физические различия RGB и CMYK в конвертере цветов
RGB работает по аддитивному принципу: в начале находится черный экран, к которому добавляются лучи красного, зеленого и синего спектра для получения белого цвета. CMYK устроен субтрактивно: белая бумага поглощает часть спектра за счет нанесения чернил голубого, пурпурного, желтого и черного тонов.
Поскольку физика процессов противоположна, далеко не каждый экранный оттенок RGB можно точно воспроизвести типографской краской. Насыщенные зеленые и оранжевые тона монитора нередко выходят за границы печатного цветового охвата, из-за чего отпечатанный логотип может выглядеть более тусклым, чем на экране.
Пошаговый расчет значений в конвертере цветов
- Введи код оттенка в поле ввода в любом удобном виде: HEX, RGB, HSL или CMYK.
- Нажми кнопку запуска конвертации под формой, чтобы отправить запрос на сервер.
- Скопируй рассчитанный эквивалент в нужном формате: HEX, RGB, HSL, CMYK или HSV.
- При подготовке макета к печати сверь полученные доли CMYK с профилем типографии.
Частые вопросы пользователей о конвертере цветов
Почему цвет на бумаге отличается от изображения на мониторе?
Дисплей излучает свет по схеме RGB, а печать использует поглощение света красками CMYK. Диапазоны оттенков у них не совпадают, поэтому предельно яркие экранные цвета невозможно передать стандартными типографскими чернилами.
Чем отличаются модели HSL и HSV?
Они близки, но используют разную геометрию пространства. В HSL шкала светлоты идет от черного через чистый тон до белого, а в HSV шкала яркости идет от черного только до чистого цвета. Из-за этого значение насыщенности в них рассчитывается иначе.
Является ли код HEX прямым аналогом RGB?
Да, это альтернативная шестнадцатеричная запись тех же трех чисел. Например, код #2E86AB точно соответствует значениям RGB 46, 134, 171, только в системе base-16 вместо десятичной.
Почему обратный пересчет из CMYK в RGB иногда меняет исходные числа?
Цветовые охваты систем не совпадают полностью. Если цвет лежал вне печатного диапазона, алгоритм подбирает ближайший доступный в CMYK аналог, и обратный перевод выдает координаты этой скорректированной точки.
Какой формат предпочтительнее указывать в стилях CSS сайта?
Для таблиц стилей отлично подходят и HEX, и RGB. Запись HEX компактнее, а RGB или RGBA удобнее читать при настройке прозрачности слоя. HSL удобен, когда ты экспериментируешь с тональностью интерфейса.