Какая форма под какую задачу
| Запись | В чём хороша | В чём плоха | | --- | --- | --- | | HEX | компактная, точная, принимается везде | ничего не говорит о самом цвете | | RGB | точная, соответствует работе экрана | неудобно править руками | | HSL | осознанно менять светлоту и насыщенность | точные круговые преобразования | | HSV | выбор в круговом пикере | почти всё остальное | | CMYK | грубое представление о печатном цвете | собственно печать |
Полезная привычка: хранить HEX, а думать в HSL. Нужен цвет на 10% светлее — в HSL это одно число, в HEX три попытки угадать.
Что принимает поле ввода
Всё это — один и тот же цвет, и всё читается:
#FF5733 FF5733 #f53 rgb(255, 87, 51)
255, 87, 51 255 87 51 hsl(11, 100%, 60%) cmyk(0%, 66%, 80%, 0%)
К разделителям претензий нет, потому что вставляют откуда угодно. Ключевое
слово CSS — red, teal, orange — тоже работает.
Всё считается здесь
Арифметика выполняется в браузере. Ничего о цветах, с которыми вы работаете, не уходит наружу — а это важнее, чем кажется, когда цвет из невыпущенной фирменной палитры.
Вопросы
В какой записи хранить цвета?+
HEX или RGB для всего, что читает машина: обе точные и однозначные. HSL — для того, что правит человек, потому что осветлить цвет там значит поменять одно число, а не угадывать три. Храните одно, остальное генерируйте.
Почему HSL иногда возвращается на оттенок мимо?+
Потому что обратный путь идёт через целые градусы и целые проценты. `hsl(11, 100%, 60%)` не может адресовать все 16,7 млн значений RGB, поэтому туда-обратно можно приехать на шаг в сторону. На экране это незаметно и важно, если вы сравниваете значения в коде.
CMYK настоящий?+
Нет, и ни у одного конвертера в вебе он не настоящий. Печатный цвет зависит от краски, бумаги и ICC-профиля; все инструменты, включая этот, показывают наивную формулу. Пользуйтесь ей, чтобы примерно понять, где цвет находится, но не для отправки в типографию.
Поддерживается ли прозрачность?+
Восьмизначный hex или `rgba()` принимаются, чтобы ваша вставка не отвергалась, но альфа отбрасывается — остальные записи здесь её не несут. Держите прозрачность отдельно.