🎨 Цвета ✓ Бесплатно

Конвертер
цветов

Введите цвет в любом виде — HEX, короткая форма, с прозрачностью — и получите сразу восемь форматов. Плюс лента оттенков, ползунки каналов и проверка контраста по стандарту доступности.

🎯8 форматов сразу
💧Пипетка и ползунки
👁️Контраст по WCAG
Копирование в клик
Выберите цвет
Каналы RGB
R79
G142
B247
A1
Готовые цвета:
HEX, RGB, HSL и HSB — это разные записи одного цвета, переводы между ними точны. А вот CMYK здесь приближённый: настоящий перевод в печать требует профиля ICC конкретной машины, краски и бумаги. Для макета значение подойдёт, цветопробу оно не заменяет.
Выбранный цвет#4F8EF7
Все форматы
  • HEX#4F8EF7
  • RGBrgb(79, 142, 247)
  • RGBArgba(79, 142, 247, 1)
  • HSLhsl(218, 91%, 64%)
  • HSBhsv(218, 68%, 97%)
  • CMYKcmyk(68%, 43%, 0%, 3%)
  • LABlab(59.64 13.2 -58.51)
  • DEC5213943
Оттенки — светлее и темнее

Тон и насыщенность сохранены, меняется только светлота. Нажмите на образец, чтобы сделать его основным.

Контраст по WCAG
На белом фоне3.21 : 1только крупный
На чёрном фоне6.54 : 1✓ AA

Для обычного текста стандарт требует контраст не ниже 4,5 : 1, для крупного — от 3 : 1.

Что на самом деле хранится в цвете

HEX, RGB, HSL и HSB — это четыре записи одного и того же числа. Экран умеет светить только тремя каналами, и любой цвет на нём это три значения от 0 до 255. Запись #4F8EF7 расшифровывается как 4F, 8E и F7 в шестнадцатеричной системе, то есть 79, 142 и 247 — те же три числа.

HSL и HSB пересобирают эту тройку в другие координаты: тон, насыщенность и светлоту. Цвет остаётся прежним, но им становится удобнее управлять — чтобы затемнить кнопку при наведении, достаточно уменьшить одно число вместо трёх. LAB устроен иначе: он описывает цвет так, как его видит глаз, и потому используется для сравнения оттенков между собой.

  • HEX — та же тройка каналов в 16-ричном виде
  • RGB — три числа от 0 до 255
  • HSL — тон, насыщенность, светлота
  • HSB — то же, но третья координата яркость
  • LAB — цвет с точки зрения восприятия глазом
Что переводится точно Обратимо
HEX ↔ RGB точно
RGB ↔ HSL точно
RGB ↔ HSB точно
RGB → LAB точно, D65
Что приближённо Осторожно
RGB → CMYK нужен профиль ICC
Яркие цвета в печати вне охвата
Цвет на разных экранах зависит от матрицы
Перед тиражом нужна цветопроба

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

Разбейте код на три пары знаков и переведите каждую из шестнадцатеричной системы в десятичную. В #4F8EF7 пара 4F даёт 79, 8E — 142, F7 — 247. Считать в уме проще так: первый знак умножьте на 16 и прибавьте второй, где A равно 10, а F — 15.
Это сокращение, при котором каждый знак удваивается: #f0a разворачивается в #ff00aa. Форма работает только тогда, когда в каждой паре обе цифры одинаковы, поэтому произвольный цвет так записать нельзя.
Потому что перевод без профиля ICC приблизителен, а часть ярких экранных оттенков в печати недостижима физически. Формула на этой странице годится для заполнения полей в макете и для оценки, но перед тиражом нужна цветопроба в типографии.
Это цветовое пространство, построенное вокруг человеческого восприятия: одинаковое изменение чисел даёт примерно одинаковое изменение видимого цвета. Благодаря этому в LAB удобно сравнивать оттенки и считать, насколько два цвета различимы глазом.
Посмотрите на коэффициент контраста в блоке WCAG. Для обычного текста стандарт требует не меньше 4,5 : 1, для крупного — от 3 : 1. Максимально возможное значение равно 21 : 1, столько даёт чёрный на белом.
Нет. Одни и те же три числа матрицы отображают по-разному: сказываются охват, калибровка и настройки яркости. Поэтому в задачах, где точность критична, работают с калиброванным монитором и профилями, а не с одними числовыми значениями.