Color Models Explained: HEX, RGB, HSL, and CMYK

Screens make color by mixing red, green, and blue light, which is what RGB describes — three values from 0 to 255. Pure red is rgb(255, 0, 0); mixing all three at full gives white. It's an additive model, because adding light moves toward white.

HEX is just RGB written in base 16 for the web: #FF0000 is the same pure red, where the pairs FF, 00, 00 are the red, green, and blue values in hexadecimal. HEX and RGB are interchangeable ways of naming the same screen color.

HSL and HSV describe color the way people think about it. Both start with hue — the position on the color wheel from 0 to 360 degrees — then add saturation for how vivid the color is. HSL's third value is lightness; HSV's (also called HSB) is value or brightness.

These models make adjusting a color intuitive: keep the hue and dial saturation down for a muted version, or change lightness for a tint or shade. That's why color pickers so often use them.

Print works the opposite way from screens. Instead of adding light, ink subtracts it from white paper, so print uses cyan, magenta, yellow, and black — CMYK, where K is the key black. Layering inks moves toward black, making it a subtractive model.

This is why a design can look different printed than on screen: not every bright RGB color can be reproduced with ink. Converting to CMYK gives a mathematical equivalent, but the true printed result also depends on the printer, paper, and color profile.