Color Contrast Checker
Test text and background colors against WCAG contrast rules.
Large text sample
Normal body text sample â the quick brown fox jumps over the lazy dog.
Contrast Ratio
14.63:1
âAA â Normal textPass
âAA â Large textPass
âAAA â Normal textPass
âAAA â Large textPass
Check WCAG Color Contrast
Text must have enough contrast against its background to be readable by everyone, including people with low vision. The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios; this tool measures the ratio between two colors and tells you exactly which levels it passes.
The thresholds
- AA normal text: 4.5:1
- AA large text (18px bold / 24px): 3:1
- AAA normal text: 7:1
- AAA large text: 4.5:1
Why it matters
Sufficient contrast is both an accessibility requirement and good design. It is also a legal requirement in many jurisdictions, and poor contrast is one of the most common accessibility failures.
Private & Processed Locally
The contrast ratio is computed in your browser using the official WCAG luminance formula.
Frequently Asked Questions
Common questions about the Color Contrast Checker.
What contrast ratios does WCAG require?
4.5:1 for normal text and 3:1 for large text at AA; 7:1 and 4.5:1 at AAA.
Why does contrast matter?
Sufficient contrast makes text readable for everyone, including people with low vision, and is often legally required.
Is it private?
Yes, the ratio is computed in your browser.