Tools / Contrast Checker

Contrast Checker

Test foreground/background color pairs against WCAG 2.1 AA and AAA standards. See a live preview of how your text will look.

Sample text preview

Coloripedia design

The quick brown fox jumps over the lazy dog. This is normal body text at 16px to test WCAG AA compliance.

Small text at 12px — used for captions and labels

Contrast ratio

17.40:1

AAA

WCAG 2.1 results

AA Normal text (≥4.5:1) Pass
AA Large text (≥3:1) Pass
AAA Normal text (≥7:1) Pass
AAA Large text (≥4.5:1) Pass

WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt bold or 24pt).
WCAG AAA requires 7:1 for normal and 4.5:1 for large text.

Understanding WCAG contrast

The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios to ensure text is readable by people with low vision or color blindness.

AA (normal text)

4.5:1

Required for body text and UI components under 18pt (or 14pt bold).

AA (large text)

3:1

Required for text 18pt and above, or 14pt bold and above.

AAA (normal text)

7:1

Enhanced contrast for maximum accessibility. Recommended for critical content.

AAA (large text)

4.5:1

Highest standard for large text. Required for Level AAA compliance.

Copied!