HEX, RGB, HSL, CMYK: Color Formats Explained for Designers
Published: July 12, 2025 · 5 min read
The same color specified incorrectly in different formats can cost a designer hours of debugging. Understanding HEX, RGB, HSL, and CMYK is essential for any web developer or designer.
HEX — the web standard
- Six-digit hexadecimal code (#RRGGBB).
- Each pair represents red, green, blue intensity (00-FF).
- Short form: #RGB expands to #RRGGBB.
- Most common format in CSS and HTML.
RGB — how screens see color
- Three channels, each 0-255 (rgb(79, 70, 229)).
- Directly maps to how screens emit light.
- Intuitive for developers working with programmatic color manipulation.
HSL — how humans think about color
- Hue (0-360 color wheel), Saturation (0-100% intensity), Lightness (0-100% brightness).
- Best for creating color palettes, generating shades/tints, and design systems.
CMYK — for print, not screens
- Cyan, Magenta, Yellow, Key (black).
- Subtractive model for printed materials.
- Cannot be used directly in CSS — must convert to RGB/HEX for web use.
Quick conversion reference
Here's the brand indigo color in all four formats:
| Format | Value |
|---|---|
| HEX | #4f46e5 |
| RGB | rgb(79, 70, 229) |
| HSL | hsl(239, 67%, 59%) |
| CMYK | cmyk(65%, 69%, 0%, 10%) |
HEX, RGB, HSL, CMYK: форматы цветов простыми словами
Опубликовано: 12 июля 2025 г. · 5 мин чтения
Цифровой дизайн и веб-разработка оперируют несколькими способами описания одного и того же оттенка. Разберем ключевые форматы представления цвета.
RGB (Red, Green, Blue)
Аддитивная модель для излучающих свет дисплеев. Смешение красного, зеленого и синего лучей в диапазоне от 0 до 255 дает белый цвет (255, 255, 255).
HEX (Шестнадцатеричный код)
Тот же RGB, но записанный в шестнадцатеричной системе счисления от 00 до FF (например, #4F46E5). Общепринятый стандарт в CSS и графических редакторах.
HSL (Hue, Saturation, Lightness)
Наиболее естественная модель для человека: цветовой круг от 0 до 360 градусов, процент насыщенности и яркости. Идеальна для создания гармоничных дизайн-систем и тем оформления.
CMYK (Cyan, Magenta, Yellow, Key/Black)
Субтрактивная модель для типографской печати на бумаге. Смешение базовых красок поглощает свет, формируя затемнение.