Руководство

Как перевести HEX-код цвета в RGB и HSL и узнать его яркость

Узнайте, как быстро перевести HEX-код в RGB и HSL, правильно раскрыть трехзначную запись и рассчитать числовую оценку яркости цвета.

Инструмент Конвертер HEX-цвета

Для перевода шестнадцатеричного цвета в другие форматы достаточно указать код из трех или шести шестнадцатеричных цифр, выбрать нужный формат вывода и выполнить расчет. Онлайн-сервис моментально выдает точные параметры каналов и числовую оценку яркости.

Подготовка и ввод шестнадцатеричного значения

Онлайн-инструмент работает с классической шестнадцатеричной записью цвета. Вы можете использовать как полную шестизначную форму, так и сокращенный трехзначный вариант. Если ввести трехзначный код, система автоматически продублирует каждый символ, превратив его в стандартный шестизначный эквивалент перед началом математической обработки.

Перед запуском используйте Конвертер HEX-цвета, чтобы быстро проверить корректность строки. Символ решетки в начале можно указывать или опускать: пробелы по краям строки удаляются автоматически. Буквы шестнадцатеричной шкалы допускается вводить как в строчном, так и в заглавном регистре.

Пошаговая инструкция по конвертации цвета

  1. Вставьте исходный шестнадцатеричный код в поле ввода. Подойдут варианты вида f5a, #fff, 3498db или #3498db.
  2. Выберите необходимый формат вывода. Доступны четыре варианта: «Все» (выводит HEX, RGB и HSL одновременно), «HEX», «RGB» или «HSL».
  3. Нажмите кнопку запуска расчета, чтобы получить готовые числовые данные.
  4. Скопируйте нужную строку или отдельные значения цветовых каналов для вставки в графический редактор или файл стилей.

Как интерпретировать полученные параметры

После завершения расчета сервис формирует структурированный результат. Значение HEX возвращается в нормализованном виде со строчными буквами. Представление RGB содержит целочисленные значения красного, зеленого и синего каналов в диапазоне от 0 до 255. Формат HSL включает оттенок в градусах от 0 до 360, а также проценты насыщенности и светлоты, округленные до целых чисел.

Дополнительно инструмент вычисляет оценку яркости по формуле с весовыми коэффициентами: 0,299 для красного, 0,587 для зеленого и 0,114 для синего канала. Если вам также требуется альтернативный способ работы с палитрами, используйте Конвертер HEX в RGB и HSL для быстрого пересчета значений.

Практический пример вычисления

Дизайнер переносит акцентный синий цвет из веб-макета в таблицу стилей и хочет получить полные параметры оттенка. В поле ввода вносится значение #3498db, а формат вывода остается в положении «Все».

В результате обработки сервис возвращает нормализованный код #3498db, строку rgb(52, 152, 219) с отдельными значениями каналов R=52, G=152, B=219, а также строку hsl(204, 70%, 53%). Значение яркости составляет 129,738, что подтверждает статус светлого тона.

Технические ограничения инструмента

  • Оценка яркости служит числовым ориентиром и не заменяет проверку контрастности по стандартам доступности интерфейсов.
  • Сервис принимает только шестнадцатеричные коды: строки формата rgb(...) и hsl(...) не могут служить исходными данными.
  • Значения с альфа-каналом или восьмизначные шестнадцатеричные строки прозрачности отклоняются при проверке.

Распространенные ошибки при вводе

  • Вставка шестнадцатеричных строк нестандартной длины, например из четырех или восьми символов с прозрачностью. Оставляйте только три или шесть шестнадцатеричных знаков.
  • Использование символов, не входящих в шестнадцатеричный диапазон от 0 до 9 и от A до F. Проверяйте код на наличие случайных букв и знаков препинания.
  • Попытка ввести готовые функции CSS вроде rgb(0, 0, 0). Конвертер рассчитан исключительно на прямой ввод HEX-значений.

Часто задаваемые вопросы

Какой HEX-код можно ввести в поле?

Подходят строки ровно из трех или шести шестнадцатеричных цифр с необязательным символом решетки в начале.

Как получить все цветовые модели одновременно?

Выберите вариант «Все» в списке форматов, чтобы сервис сразу рассчитал параметры HEX, RGB и HSL.

Можно ли вводить цвет с прозрачностью?

Нет, восьмизначные шестнадцатеричные значения с прозрачностью и альфа-каналы не поддерживаются.

Инструмент

Конвертер HEX-цвета