WCAG Contrast Checker
Check color contrast for accessibility compliance
Large Text Preview
This is a preview of normal text (16px). The quick brown fox jumps over the lazy dog.
Small text (14px): Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Contrast Ratio
21.00:1
Normal Text
AAA
Requires 4.5:1 (AA) or 7:1 (AAA)
Large Text
AAA
Requires 3:1 (AA) or 4.5:1 (AAA)
How to Use
- Use the controls above to customize your palette
- Click any color to copy its HEX code
- Use "Copy CSS" to get CSS variables
- Use "Download PNG" to save the palette
FAQ
What is WCAG contrast ratio?
WCAG contrast ratio measures the difference in luminance between foreground and background colors, ensuring text is readable for users with visual impairments.
What is the minimum contrast ratio for WCAG AA?
WCAG AA requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text.
What is the minimum contrast ratio for WCAG AAA?
WCAG AAA requires a minimum contrast ratio of 7:1 for normal text and 4.5:1 for large text.