Конвертер цветов HEX в RGB, HSL, CMYK онлайн

Цвет на экране складывается из трёх каналов — красного (R), зелёного (G) и синего (B), каждый от 0 до 255. Разные форматы — лишь разные записи одних и тех же трёх чисел: HEX удобен в CSS и дизайн-макетах, HSL — чтобы делать цвет светлее или темнее, CMYK — для печати.

Форматы

Прозрачность (альфа-канал) задаётся четвёртым значением: rgba(0, 0, 0, 0.5), hsl(0 0% 0% / 50%) или восьмизначным HEX #00000080. Конвертер сохраняет её в HEX, RGB и HSL, образец показывается на шахматном фоне.

Как перевести HEX в RGB вручную

Разбейте код на пары и переведите каждую из шестнадцатеричной системы в десятичную: #8bc34a → 8b = 8 × 16 + 11 = 139, c3 = 12 × 16 + 3 = 195, 4a = 4 × 16 + 10 = 74. Получается rgb(139, 195, 74). Обратно — каждое число делится на 16: частное и остаток — две шестнадцатеричные цифры.

Контраст текста

Чтобы текст читался, контраст его цвета с фоном по стандарту доступности WCAG 2 должен быть не меньше 4,5:1 для обычного текста и 3:1 для крупного (от 24 px). Конвертер считает контраст выбранного цвета с белым и чёрным и подсказывает, каким делать текст на этом фоне.

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

Как узнать код цвета на сайте или картинке?

В браузере — инструментом разработчика (F12, вкладка Elements, стиль color или background) или пипеткой в Chrome. В графических редакторах — пипеткой: Photoshop, Figma и Paint показывают HEX и RGB. Полученный код вставьте в конвертер, чтобы получить остальные форматы.

Почему CMYK на печати выглядит иначе?

Экран смешивает свет, а принтер — краски, и часть ярких экранных цветов краской не воспроизводится. Конвертер переводит в CMYK по простой формуле без цветового профиля; для типографии точный перевод делают в Photoshop или Illustrator с профилем конкретной печати (например, ISO Coated или FOGRA39).

Чем HSL отличается от HSV?

Тон в обоих одинаковый, а вторые числа разные. В HSL светлота 100% — всегда белый, а чистый цвет — при 50%. В HSV яркость 100% — самый яркий вариант цвета, а белый получается при нулевой насыщенности. В CSS используется HSL, в палитрах графических редакторов — HSV.

Какие названия цветов можно вводить?

Все 148 названий из стандарта CSS (red, navy, coral, rebeccapurple и другие, без учёта регистра и пробелов) и основные цвета по-русски: красный, зелёный, синий, жёлтый, оранжевый, фиолетовый и т. д. Если цвет совпадает с названием в CSS, конвертер его покажет.