WCAG Contrast Ratio Checker
Check WCAG AA/AAA contrast ratio between two colors.
Sample Text Preview
Small text (14px) looks like this
About Contrast Ratio Checker
Enter a foreground (text) color and background color to calculate the contrast ratio and see whether it passes WCAG 2.1 accessibility standards for AA (4.5:1 for normal text) and AAA (7:1). Essential for accessible web design.
Use Cases
Ensuring accessible color choices for web content, passing WCAG audits, selecting readable text colors for UI design, verifying button and link color accessibility.
How It Works
Calculates relative luminance for each color per the WCAG 2.1 spec: L = 0.2126R + 0.7152G + 0.0722B (with gamma correction). Contrast ratio = (L1 + 0.05) / (L2 + 0.05).
Frequently Asked Questions
What is WCAG?
Web Content Accessibility Guidelines (WCAG) are international standards for web accessibility. AA compliance is required by law in many countries.
What contrast ratio do I need to pass?
WCAG AA: 4.5:1 for normal text, 3:1 for large text (18pt+). WCAG AAA: 7:1 for normal text, 4.5:1 for large text.