Изображения

Выбор цвета

Выбирайте цвет на визуальном поле и получайте код HEX, RGB и HSL.

  • Мгновенно
  • Бесплатно
  • Приватно (обработка локально)
  • Без регистрации
HEX
RGB
HSL

Один цвет — все его коды

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

  1. Задайте тон

    Радужный ползунок выбирает базовый цвет.

  2. Уточните на поле

    Насыщенность по горизонтали, яркость по вертикали.

  3. Скопируйте код

    HEX, RGB или HSL, при необходимости с прозрачностью.

Пример: яркий оранжевый

ФорматЗначение
HEX#FF8800
RGBrgb(255, 136, 0)
HSLhsl(32, 100%, 50%)

Стандартные преобразования sRGB, округление до целых. Всё считается в браузере.

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

Как работает поле цвета?

Большой квадрат показывает насыщенность (слева направо) и яркость (снизу вверх) для тона, выбранного ползунком. Кликните или потяните для выбора; значения HEX/RGB/HSL обновляются вживую.

В чём разница HEX, RGB и HSL?

HEX — компактный шестнадцатеричный код (#FF8800). RGB описывает цвет через красный, зелёный, синий (rgb(255, 136, 0)). HSL — через тон, насыщенность, светлоту (hsl(32, 100%, 50%)), что удобнее для подстройки оттенка.

Зачем прозрачность?

Она задаёт прозрачность (альфа-канал). Ниже 100 % коды становятся rgba()/hsla(), а HEX получает два символа (напр. #FF8800CC). Полезно для наложений и теней.

Цвет точен для веба?

Да: значения считаются стандартными преобразованиями sRGB и округляются до целых. Копируйте формат под ваш CSS. Всё считается локально, ничего не отправляется.