Check WCAG color contrast ratios between text and background colors. Verify AA and AAA accessibility compliance.
Normal text (16px)
Large text (24px bold)
The quick brown fox jumps over the lazy dog.
Contrast Ratio
11.50:1
WCAG Level
Normal Text
Large Text
UI Components
AA
Pass
Pass
Pass
AAA
Pass
Pass
Pass
WCAG Color Contrast Checker
Check if your text and background color combinations meet WCAG accessibility standards. Test for AA and AAA compliance for normal text, large text, and UI components.
How to Use
Pick a foreground (text) color and background color.
See the contrast ratio and WCAG compliance results instantly.
Use the swap button to reverse the colors.
Frequently Asked Questions
What is WCAG color contrast?+
WCAG (Web Content Accessibility Guidelines) defines minimum contrast ratios between text and background colors. AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 for normal text and 4.5:1 for large text.
What counts as large text?+
Large text is defined as 18pt (24px) or larger for regular weight, or 14pt (18.66px) or larger for bold weight.
Why does color contrast matter?+
Good contrast ensures text is readable for people with low vision or color deficiencies. It's also a legal requirement under ADA and similar accessibility laws in many countries.