Color Contrast Checker (WCAG)

Check if a foreground/background colour pair meets WCAG AA and AAA accessibility standards.

Normal text — The quick brown fox jumps over the lazy dog.
Large text — Quick brown fox
Contrast ratio
WCAG AA — normal text (≥ 4.5:1)
WCAG AA — large text (≥ 3:1)
WCAG AAA — normal text (≥ 7:1)
WCAG AAA — large text (≥ 4.5:1)

Features

Contrast ratio display
WCAG AA/AAA status
Live text preview
Normal & large text

How to Use

1. Pick a foreground colour (text colour).

2. Pick a background colour.

3. The contrast ratio and WCAG AA/AAA pass-fail status appear live.

Frequently Asked Questions

What is the WCAG contrast requirement?
WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text.

Related Tools