WCAG Color Contrast Checker
Pick a text color and a background color: get the contrast ratio, AA and AAA pass/fail results, and a real preview of how readable it is.
Contrast ratio (from 1:1 to 21:1)
This is a sample of normal text: a paragraph just like the ones your visitors read every day.
This is a large heading
What the AA and AAA levels mean
The WCAG (Web Content Accessibility Guidelines) measure readability with a contrast ratio that runs from 1:1 (no contrast) to 21:1 (black on white). Level AA, the standard required by most accessibility regulations, calls for at least 4.5:1 for normal text and 3:1 for large text. The stricter AAA level raises those thresholds to 7:1 and 4.5:1. "Large text" means text of at least 24 px, or 18.5 px if it's bold.
Why contrast really matters
Roughly one in twenty people has some form of low vision or color vision deficiency, and everyone struggles to read a screen in direct sunlight or with the brightness turned down. Insufficient contrast is one of the most common accessibility failures on the web — and one of the easiest to fix: often all it takes is darkening the text or lightening the background by a few shades. Remember to check secondary states too, such as links, placeholders, and the text on colored buttons.