WCAG Contrast Checker
Check contrast ratio between foreground and background colors.
About this tool
Measure contrast between text and background colors against WCAG guidelines so UI text stays readable for more users. Includes live preview and AA/AAA pass indicators.
What you get
- Contrast ratio with live text preview
- WCAG AA and AAA pass/fail for normal and large text
- Hex color inputs with instant recalculation
How to use
Pick or paste foreground and background colors and read the ratio and WCAG outcome.
FAQ
What is WCAG contrast ratio requirement?
Normal text needs at least 4.5:1 for AA and 7:1 for AAA; large text has lower thresholds. The checker shows pass/fail for each level.
How to check if text color meets accessibility standards?
Enter foreground and background hex colors and read the contrast ratio with a live text preview.
What is the difference between WCAG AA and AAA?
AAA targets stricter contrast for maximum readability; AA is the common legal and design baseline for most interfaces.
What contrast ratio is needed for small text?
Body-sized text below roughly 18 pt regular (or 14 pt bold) must meet the normal-text AA ratio of 4.5:1.
By using this tool you agree to our Terms of Use and Privacy Policy. Results are provided as-is without warranty.