Color models & codes

OKLCH

A modern, perceptual way to write color as lightness, chroma and hue. Supported in CSS as oklch().

Also called OKLab, oklch()

OKLCH writes a color as lightness, chroma (colorfulness) and hue, built on the OKLab color space. Unlike HSL, colors with the same OKLCH lightness actually look equally light.

That makes it great for design systems: shift the hue and keep lightness and chroma, and every color in the set stays balanced. Modern browsers support it in CSS, for example oklch(62% 0.19 255).