Colors
WCAG Contrast Checker
AA and AAA for normal text, large text and UI components. With luminance calculation.
Esc Clear
Contrast ratio
AA (≥4.5 / 3)AAA (≥7 / 4.5)
Relative luminance (FG)
Relative luminance (BG)
Enter two colors to check contrast
What does WCAG Contrast Checker?
Check color contrast ratios to ensure WCAG accessibility compliance.
How to use WCAG Contrast Checker?
- Enter the foreground (text) color.
- Enter the background color.
- View the contrast ratio and WCAG AA/AAA pass/fail results.
Key features
- Checks WCAG 2.1 AA and AAA compliance for normal and large text.
- Shows exact contrast ratio value.
- Suggests improved colors if contrast fails.
Frequently asked questions
What is the minimum contrast ratio for accessibility?
WCAG AA requires a minimum of 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1 for normal text.
Why does contrast matter?
Sufficient contrast ensures text is readable for people with low vision or color blindness.
Is this tool free?
Yes, this tool is completely free and requires no registration.
Is my data saved?
No. All calculations happen in your browser only — no data is sent to any server.