Интерфейсы и CSSРаботает в браузере

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

Введите 3- или 6-значный HEX и получите нормализованный HEX, RGB, HSL и числовые каналы для design-token workflow.

  • HEX → RGB/HSL
  • 3/6 digit support
  • Локальный расчёт
Онлайн-инструмент

Попробуйте инструмент

Добавьте данные, выберите нужные параметры и получите готовый результат.

Исходные данные

Результат

#336699
HEX: #336699
RGB: rgb(51 102 153)
HSL: hsl(210 50% 40%)
Channels: R 51, G 102, B 153

Ваши данные остаются здесь

Текст и выбранные файлы обрабатываются в текущем браузере и не отправляются на сервер для получения результата.

Проверено: 2026-07-17
01

Как пользоваться

  1. 1

    Введите HEX-цвет с символом # или без него.

  2. 2

    Проверьте нормализованное значение и preview.

  3. 3

    Скопируйте RGB или HSL CSS value.

02

Что умеет инструмент

  • Нормализация short HEX в полный #RRGGBB.
  • Расчёт RGB channels и CSS rgb() notation.
  • Расчёт HSL hue, saturation и lightness.
03

Когда пригодится

  • Перевод HEX design token в CSS rgb() или hsl().
  • Проверка цветовых каналов перед документацией UI kit.
  • Быстрая нормализация short HEX из макета.
04

Что происходит внутри

HSL округляется до целых градусов и процентов для практического CSS output.

Расчёт выполняется в браузере и не требует network request.

05

Вопросы и ответы

Почему вход только HEX?

Так инструмент остаётся детерминированным и безопасным для быстрого token conversion.

Это заменяет contrast checker?

Нет. Для проверки доступности пары цветов используйте отдельный инструмент контраста.