Contrast Checker
Check text/background color pairs against WCAG AA and AAA contrast requirements.
Contrast calculations run locally in your browser.
What is contrast checker?
Low-contrast text is one of the most common accessibility failures. This checker computes the WCAG contrast ratio between any two colors and tells you whether the pair passes AA and AAA for normal and large text.
A live preview shows your exact combination, so you can judge readability with your own eyes before shipping a palette.
How to use it
-
Pick text and background colors
Use the two color pickers or type HEX values.
-
Read the ratio and badges
Pass/fail is shown for AA and AAA at both text sizes.
Examples
Maximum contrast
Black on white is the reference maximum.
#000000 on #ffffff
Result: 21.00 : 1 — passes AA and AAA at all sizes
Frequently asked questions
WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt bold). AAA raises these to 7:1 and 4.5:1.
Roughly 18pt (24px) regular or 14pt (18.5px) bold. The large-text thresholds are lower because bigger glyphs stay legible at lower contrast.