Конвертер кодов цвета
Один цвет в HEX, RGB, HSL, CMYK и OKLCH, плюс шкала тонов и палитры.
Инструмент
Введите один цвет, и инструмент переведёт его во все распространённые форматы: HEX, RGB, HSL, HSV, CMYK и OKLCH. Можно написать HEX-код (3, 4, 6 или 8 знаков), значение rgb() или hsl(), CSS-название цвета вроде rebeccapurple либо выбрать оттенок в пипетке-палитре. Каждая строка результата копируется одним щелчком. Из того же цвета строится шкала из 11 тонов, от 50 до 950.
В разделе палитр вы увидите комплементарные, аналогичные, триадные, тетрадные и расщеплённые комплементарные цвета. Рядом с каждым цветом указаны коэффициент контраста с белым и чёрным текстом и отметка AA; для обычного текста WCAG AA требует не менее 4,5:1. Результат выгружается как CSS-переменные, объект colors для Tailwind или JSON. Если добавить ?renk= к адресу страницы, выбранным цветом можно поделиться ссылкой.
Ограничения: значение CMYK приблизительно и рассчитано на экран, профиля печати в нём нет, поэтому для типографии сверьте его с профилем самой типографии. Экраны передают цвет по-разному, так что одинаковый вид одного кода на каждом устройстве гарантировать нельзя. Предложенные палитры служат отправной точкой, а не решением по фирменному стилю. Проверка контраста сравнивает только цвет текста и фона; размер и насыщенность шрифта оценивайте отдельно.
Частые вопросы
Какие форматы цвета можно вводить?
HEX из 3, 4, 6 или 8 знаков, rgb() и rgba(), hsl() и hsla(), а также CSS-названия цветов. Выбор цвета записывает значение в то же поле.
Даст ли значение CMYK тот же цвет при печати?
Гарантировать это нельзя. Показанный здесь CMYK приблизителен и рассчитан на экран, профиля печати в нём нет. Для печати проверяйте по профилю вашей типографии.
Что значит отметка AA?
Отметка о прохождении появляется, когда коэффициент контраста цвета с белым или чёрным текстом достигает порога WCAG AA, то есть 4,5:1. Для крупного текста порог ниже, а этот инструмент проверяет только уровень 4,5:1.
Отправляются ли введённые цвета куда-нибудь?
Нет. Все преобразования выполняются в вашем браузере. До 8 последних цветов хранятся в памяти браузера на этом устройстве и на сервер не попадают.
