THE TOOLBOX
◈ Runs in your browserContrast checker
Find color combinations that everyone can read. Check WCAG text contrast instantly.
Good to know
How to use Contrast checker
Choose a text color and background color to calculate their contrast ratio. Compare the result with WCAG 2.x AA and AAA thresholds for normal and large text.
- Enter six-digit hex colors or use the text and background color pickers.
- Read the contrast ratio and the four AA/AAA results.
- Adjust or swap the colors until the pair meets the text-size threshold you need.
Common questions
What contrast ratio do I need?
For WCAG AA, normal text requires at least 4.5:1 and large text at least 3:1. AAA requires 7:1 for normal text and 4.5:1 for large text.
What counts as large text?
WCAG defines large text as at least 18pt (24px), or at least 14pt (about 18.7px) when bold.
Does this test a complete page for accessibility?
No. It tests a pair of opaque colors on a solid background. Page structure, interaction, focus behavior and other accessibility requirements need separate checks.