Contrast that holds up in review
What the WCAG thresholds actually require, where teams commonly slip, and how to fix a failing pair without redesigning the palette.
Contrast is the one accessibility requirement that is fully computable, which makes it the one most often failed by accident — the number is easy to check and easy to never check.
The thresholds
- 1.4.3 Contrast (Minimum), AA — 4.5:1 for text, 3:1 for large text.
- 1.4.6 Contrast (Enhanced), AAA — 7:1 for text, 4.5:1 for large text.
- 1.4.11 Non-text Contrast, AA — 3:1 for interface components and meaningful graphics. No AAA tier exists.
“Large” means 18.66px bold or 24px regular and above. Not 18px. Not “headings”.
Where palettes usually fail
Placeholder and helper text
Muted text is the most common failure in a design system, because it is chosen for tone rather than measured. If it conveys information, it needs 4.5:1 like any other text.
Focus indicators and borders
Input borders, focus rings and icon buttons are non-text contrast: 3:1 against whatever is adjacent. A 1px hairline border at 1.4:1 is invisible to a lot of people.
Text on brand colour
A saturated brand colour rarely carries both black and white text well. Pick one, measure it, and put the result in the design system so nobody has to guess.
Disabled states
Disabled controls are exempt from 1.4.3, and the exemption is routinely over-applied. Something that looks disabled but is not gets the exemption of neither.
Fixing a pair without redesigning
Almost every failing pair can be fixed by moving lightness in OKLCH while holding hue and chroma. The colour stays recognisably itself; it just moves along the one axis that governs contrast. Colorstruct calculates the smallest such change for each threshold and offers it — it never applies one on its own, because your palette is your decision.
When no lightness change works — which happens when both colours sit mid-scale — the honest answer is that the pair cannot be used together for text, and one of them needs to change more fundamentally.
What the ratio does not tell you
Contrast ratio is a luminance calculation. It says nothing about whether two colours aredistinguishable from each other, which is a different question and the one that matters for charts, status colours and category labels. For that, look at perceptual distance and run the colour-vision simulations.