Skip to main content
WCAGrules
Quick navigation

Fixes by subject · 29 techniques

How to Fix Color and Contrast Problems

The most-failed rule on the web. Also the one people are most confident a machine has already settled for them.

Low-contrast text turns up on the large majority of home pages, year after year, which makes it the most common failure anybody measures. It is also the one people assume a machine settles for good. It does not. Where some of the pixels behind a line of text pass and some do not, there is no clear method for deciding whether the text is legible. So a green tick from a contrast checker is not the same thing as a met criterion. The techniques here cover meeting the ratios and pairing color with a second cue, so meaning never rides on hue alone. The same goes for the shape, size and position cues that 1.3.3 covers, which is a different criterion from the color one and sits here because the fix is the same move. The rest are about letting people apply their own colors, and the failures that come from text over images and from links marked by color alone.

All 29 techniques

They run in technique order, and each one carries a tag. Sufficient techniques satisfy a rule. Advisory ones help without being required. Failures document a specific way of getting it wrong. None of them is mandatory, because W3C publishes techniques as documented ways of meeting a criterion rather than the only ways, so your own approach conforms as long as it meets the criterion.

More on Colour and contrast

The other 13 subjects

Knowing the technique is not the same as knowing you need it.

The free scan checks 10 pages in a real browser and maps every machine-checkable failure to the exact fix guide that clears it.

Run the free scan

Go somewhere useful

Find tools, resources and your workspace.

29 destinations