vocab.design

color

Chroma

also called C in OKLCH, C in HCT (material)

Colourfulness measured in absolute terms rather than as a percentage of the maximum, so a light pastel and a dark ink can be compared on one scale.

Chroma is how far a colour sits from grey, stated as an amount rather than as a share of anything. In oklch() it is the middle number, an open ended figure that starts at zero and runs to roughly 0.37 for the most vivid colours sRGB can reach. Zero chroma is grey, at every lightness and with no hue left to name. The useful property is that 0.12 means the same quantity of colour on a pale surface as it does on a near black one, which is what lets a whole palette be tuned on one number.

Saturation answers a different question, and the difference is not pedantry. Saturation is relative: colourfulness as a proportion of the most a colour could be at that lightness. A dark navy and a pale sky blue can report the same saturation figure while one of them holds several times the chroma of the other, and HSL makes this worse by letting its saturation channel visibly drag its lightness channel around, so a row of swatches at one HSL lightness is not a row at one perceived lightness. Chroma is the axis that stays put: change it and only the amount of colour moves.

What chroma does not promise is availability. The maximum reachable chroma depends on both lightness and hue, peaking at a cusp somewhere in the middle of the lightness range, which is why a colour ramp cannot hold one chroma across every step and why designed scales taper it at the light and dark ends instead. Radix names the step where the taper peaks, its step 9, the purest step in the scale, and Material’s HCT model carries a chroma channel of its own for the same reason. Ask for more than the cusp allows and the value is quietly gamut mapped, so the colour you receive is not the one you wrote (see colour gamut).

In practice the numbers are small and worth memorising. A tinted neutral lives around 0.005 to 0.03, enough that the grey has a temperature and not so much that it reads as a colour. A body accent sits near 0.12 to 0.18. Anything above that is a highlight applied to something small, because a large field of high chroma makes the type on it vibrate. Dark themes want the same hues pulled down again, since chroma that looked composed on white glows against a dark surface.

Which word?

If you wantsay
comparing colourfulness across colours of different lightnesschroma
describing how vivid or washed out a colour lookssaturation
bringing an impossible colour into a display's rangegamut mapping
explaining why an HSL ramp looks uneven and an OKLCH one does notperceptual uniformity

Implementations

Specimens illustrate the concept; for production use, start here.

radixthe purest step (step 9)

Sources