Contrast Checker
Check WCAG color contrast ratio between foreground and background colors.
Processed on your device β never uploaded
Large Text (24px+)
Normal body text at standard size (16px). This is what most of your content will look like.
Small text example for captions and fine print.
Contrast Ratio
3.68:1
AA - Large Text
Min 3:1
AA - Small Text
Min 4.5:1
AAA - Large Text
Min 4.5:1
AAA - Small Text
Min 7:1
Frequently Asked Questions
What is WCAG contrast ratio?
WCAG contrast ratio measures the luminance difference between text and background colors. A higher ratio means better readability and accessibility.
What contrast ratio do I need for WCAG AA compliance?
WCAG AA requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text (18px+ bold or 24px+ regular).
What is the difference between WCAG AA and AAA?
AA is the standard accessibility level requiring 4.5:1 for normal text, while AAA is the enhanced level requiring 7:1 for normal text and 4.5:1 for large text.
Why is color contrast important for web design?
Sufficient contrast ensures that text is readable for users with low vision or color blindness, and is a legal requirement under many accessibility laws.