Color Contrast Checker
Check WCAG contrast ratio between any two colors instantly. See if your text meets AA or AAA accessibility standards.
About this tool
Paste a foreground and background hex color and get the WCAG contrast ratio with AA/AAA verdicts for normal and large text, plus a live preview swatch.
Accessibility is now a grading factor for every product: this check runs in your browser and gives you instant, standards-based answers while you design — no more guessing whether that gray text is readable.
FAQ
What is WCAG contrast ratio?
A ratio from 1:1 to 21:1 describing luminance difference between text and background. WCAG AA requires 4.5:1 for normal text, 3:1 for large text.
Why does contrast matter?
Low contrast makes text unreadable for people with low vision and for everyone on bright screens. Automated accessibility audits check it first.
How do I use the result?
If it fails, darken the text or lighten the background; the tool gives you the ratio for each attempt while you tune.