1.4.3 Contrast (Minimum)

This is the most commonly failed WCAG criterion on the web. Low contrast text is difficult to read for people with low vision, colour blindness, or anyone reading in bright sunlight or on a low-quality screen.

The required contrast ratios are: 4.5:1 for normal text (under 18pt or under 14pt bold), and 3:1 for large text (18pt and above, or 14pt bold and above). Decorative text with no informational purpose is exempt, as is text in inactive UI components and logotypes.

Use a colour contrast checker during the design stage, before anything is built. Tools like the WebAIM Contrast Checker, Colour Contrast Analyser, or browser DevTools accessibility panels will give you exact ratios.

Dark text on a light background or light text on a dark background both work well. It is mid-tone combinations that tend to fail.

Check every text colour and background colour combination used on your site, including placeholder text in form fields, button labels, and text overlaid on images or gradients.

• Grey text on a white background that does not reach 4.5:1
• White text on a light-coloured button that does not reach 4.5:1
• Text overlaid on a background image where the contrast varies and dips below the minimum
• Placeholder text in form inputs that is too light

The exemption for large text uses point sizes (pt), not pixels. 18pt is approximately 24px, and 14pt bold is approximately 18.67px bold. Check which category your text falls into before applying the lower 3:1 ratio.

Gradient backgrounds are tricky because contrast varies across the gradient. Check the worst-case point where text and background are closest in value.