Color contrast checker
Pick a text and background colour to see the contrast ratio and WCAG result.
Color contrast checker
Check the contrast ratio between a text colour and a background, and whether it meets WCAG accessibility levels — with a live preview of the text on the background.
What the levels mean
The ratio runs from 1:1 (no contrast) to 21:1 (black on white). WCAG AA needs at least 4.5:1 for normal text and 3:1 for large text; AAA needs 7:1. The ratio uses relative luminance, the same formula browsers and accessibility tools use.
Frequently asked questions
What contrast ratio do I need? Aim for at least 4.5:1 for body text (AA); higher is better.
What counts as large text? Roughly 18pt (24px), or 14pt (18.66px) bold.