HEX to HSL
Каждый формат цвета описывает одно и то же на другом языке: HEX для стилей, RGB для экранов и кода, HSL для палитр, CMYK для печати. Выберите нужное преобразование и получите точное значение, живой просмотр и формулу.
Этот цвет во всех форматах
Один и тот же цвет в HEX, RGB, HSL и CMYK. Копируйте любое значение.
Перевод HEX в HSL
Любое преобразование сначала нормализует HEX в триплет sRGB (красный, зелёный, синий по шкале 0–255), а затем кодирует его как HSL. Обе записи описывают один и тот же пиксель, поэтому видимый цвет не меняется.
Прочитать вход
Разобрать значение HEX на каналы (пары шестнадцатеричных цифр, числа или проценты).
Нормализовать в sRGB
Привести каждый канал к 0–255, чтобы ошибки округления не накапливались.
Закодировать в HSL
Вывести результат в записи HSL и вставить его в таблицу стилей или дизайн-инструмент.
Формула
#FF5733 → sRGB rgb(255,87,51) → HSL hsl(11, 100%, 60%)
Пример расчёта
#FF5733 = #FF5733 = hsl(11, 100%, 60%)
Каналы округляются до целых; для обратного перевода используйте тот же инструмент, чтобы избежать расхождений.
Таблица соответствия HEX → HSL
Распространённые значения, пересчитанные по той же формуле.
| Вход (HEX) | Результат (HSL) | |
|---|---|---|
#FF5733 | hsl(11, 100%, 60%) | |
#4F46E5 | hsl(243, 75%, 59%) | |
#2ECC71 | hsl(145, 63%, 49%) | |
#3498DB | hsl(204, 70%, 53%) | |
#E74C3C | hsl(6, 78%, 57%) | |
#19AE99 | hsl(172, 75%, 39%) | |
#9B59B6 | hsl(283, 39%, 53%) | |
#F39C12 | hsl(37, 90%, 51%) | |
#34495E | hsl(210, 29%, 29%) | |
#E91F63 | hsl(340, 82%, 52%) | |
#000000 | hsl(0, 0%, 0%) | |
#FFFFFF | hsl(0, 0%, 100%) |