Color Contrast Checker

Check WCAG contrast between two colors.

Check whether your text and background colors have enough contrast for accessibility. Enter two colors to see the WCAG contrast ratio, pass/fail badges for AA and AAA (normal and large text), and a live preview of the combination.

Almost before we knew it, we had left the ground.Large text sample
Contrast ratio
14.68:1
AA · normal textPass
AA · large textPass
AAA · normal textPass
AAA · large textPass

Follows the WCAG 2 contrast formula. “Large text” means 18pt+ (or 14pt+ bold). AA is the common accessibility target; AAA is stricter.

Runs entirely in your browser — nothing is uploaded.

How to use the color contrast checker

  1. 1Pick or paste a text color.
  2. 2Pick or paste a background color.
  3. 3Read the contrast ratio and AA/AAA results.

Frequently asked questions

What contrast ratio do I need?

WCAG AA requires 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1 and 4.5:1. Aim for AA at minimum.

What counts as large text?

Roughly 18pt and up, or 14pt and up if bold. Large text is allowed a lower contrast ratio.

Related tools