👁️ Contrast Checker
Check color contrast ratios for WCAG AA/AAA accessibility compliance. Free, instant, works offline.
About WCAG Contrast
WCAG (Web Content Accessibility Guidelines) define minimum contrast ratios for text to be readable:
| Level | Normal Text | Large Text (≥18px or bold ≥14px) |
|---|---|---|
| AA | 4.5:1 | 3:1 |
| AAA | 7:1 | 4.5:1 |
Contrast ratio ranges from 1:1 (same colors) to 21:1 (black on white). Higher = better readability.
About Contrast Checker
Check color contrast ratios for WCAG accessibility compliance. Test text against background colors. See AA and AAA ratings for normal and large text. Essential for web designers and developers building accessible interfaces.
WCAG Compliance
Checks against WCAG 2.1 AA and AAA standards. Know instantly if your color combination passes accessibility requirements.
Live Preview
See your text on the background in real-time. Adjust colors with sliders or enter HEX/RGB values directly.
Normal & Large Text
Separate ratings for body text and large text/headings. Different thresholds for each — shown clearly.
Color Suggestions
Get lighter/darker suggestions that meet contrast requirements. Find accessible alternatives instantly.