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

PASS

AA - Small Text

Min 4.5:1

FAIL

AAA - Large Text

Min 4.5:1

FAIL

AAA - Small Text

Min 7:1

FAIL

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.