Contrast checker

Check WCAG AA and AAA contrast compliance for any two colors instantly.

Did you know?

WCAG AA requires a 4.5:1 contrast ratio for normal text and 3:1 for large text. AAA requires 7:1. Pick your text and background colors above to check compliance instantly.

Text color

Background color

Sample heading text

This is what body text looks like at this contrast ratio.

11.7:1

Contrast ratio

What is WCAG contrast ratio?

WCAG defines minimum contrast ratios to ensure text is readable by people with visual impairments.
AA is the standard legal requirement in most countries. AAA is the enhanced level.
Poor contrast is one of the most common accessibility failures on the web.

WCAG contrast requirements

For normal text (under 18pt): AA requires 4.5:1, AAA requires 7:1.

For large text (18pt+ or 14pt+ bold): AA requires 3:1, AAA requires 4.5:1.

For UI components (buttons, inputs, icons): AA requires 3:1.

FAQ

What contrast ratio do I need?

WCAG AA requires 4.5:1 for normal text and 3:1 for large text. It is legally required in many countries for public-facing websites.

What is WCAG?

Web Content Accessibility Guidelines — the international standard for making web content accessible to people with disabilities.

Does contrast affect SEO?

Not directly, but poor contrast drives up bounce rates, which can indirectly affect rankings.

Contrast checker

What is WCAG contrast ratio?

WCAG contrast requirements

FAQ

Related tools