Color spaces explained
FAQ
- Which color space should I use for CSS?
- HEX and RGB are standard. Modern CSS also supports oklch() and lab() for perceptually better gradients and themes.
Why color space matters
Different color spaces represent the same perceived color in different ways. Choosing the right space affects interpolation, accessibility checks, and export to CSS, print, or design tools.
Web developers usually work in sRGB (HEX/RGB/HSL), while print workflows may need CMYK and advanced design tools may use LAB for perceptually uniform adjustments.
HEX, RGB, and HSL
HEX is compact and familiar in CSS (#RRGGBB). RGB maps directly to screen channels. HSL separates hue, saturation, and lightness — useful for theme tweaks and generating tints and shades.
Use HEX/RGB for APIs and design tokens. Use HSL when you need to lighten or darken a brand color while keeping hue stable.
CMYK, LAB, and XYZ
CMYK models subtractive print inks. Converting RGB to CMYK is approximate because screens and printers have different gamuts.
LAB and XYZ are device-independent. LAB is especially useful for perceptually even gradients and accessibility-related luminance calculations.