Color Comparisons

Side-by-side explainers for the color models and notations designers use every day.

HSL vs HSV

HSL and HSV both describe color by hue, saturation and a third axis — but lightness and value behave differently. Compare the two and learn when to use each.

RGB vs CMYK

RGB is additive color for screens; CMYK is subtractive color for print. Learn the difference, why print colors look duller, and when to convert.

OKLCH vs HSL

OKLCH is a perceptually uniform color model; HSL is the older, simpler one. Compare them and learn why OKLCH gives more predictable, accessible palettes.

HEX vs RGB

HEX and RGB describe the exact same colors — one in hexadecimal, one in decimal. Learn the difference, how alpha works in each, and when to use which.

Warm vs Cool Colors

Warm colors (reds, oranges, yellows) energize; cool colors (blues, greens, purples) calm. Learn where the wheel splits, why it matters, and how to combine them.

Tint vs Shade

A tint is a color plus white; a shade is a color plus black; a tone is a color plus gray. Learn the difference and how to build clean tint/shade scales.

Pantone vs CMYK

Pantone is a spot-ink matching system; CMYK is four-ink process printing. Compare cost, consistency and color range, and learn when print jobs need each.

sRGB vs Display-P3

sRGB is the universal web color space; Display-P3 covers ~25% more colors on modern screens. Learn what wide gamut means and how to use P3 safely in CSS.

Additive vs Subtractive Color

Additive mixing combines light (RGB, screens); subtractive mixing combines pigments (CMY, paint and print). Learn why they behave so differently.