WCAG Contrast Checker

Pick a text color and a background, and see instantly whether the pairing meets WCAG AA and AAA contrast standards.

Text color

Background color

Large heading text

This is body copy at a normal reading size, shown over your chosen background.

Contrast ratio

AA · Normal

AA · Large

AAA · Normal

AAA · Large

Large text is 18.66px bold or 24px regular and up. Thresholds: AA needs 4.5 (normal) / 3.0 (large); AAA needs 7.0 (normal) / 4.5 (large).

About the contrast checker

This free tool compares a text color with a background color and reports the WCAG contrast ratio, with pass or fail results for AA and AAA at normal and large text sizes.

Use it before you finalize a color scheme. Low-contrast text is hard to read for many visitors, and accessible sites tend to convert better too.

Worked example: gray #777777 on white has a ratio of about 4.48:1, just under the 4.5:1 AA minimum for normal text. Darkening it to #767676 passes. Try both pairs above.