Toolzy

Color Contrast Checker

Check WCAG contrast ratio between two colors.

Sample heading text

This is smaller body text for contrast preview.

Contrast ratio

17.40:1

AA — normal textPass
AA — large textPass
AAA — normal textPass
AAA — large textPass

Test foreground and background colors against WCAG AA and AAA accessibility thresholds.

How to use

  1. Pick or type the text and background colors.
  2. Read the contrast ratio.
  3. Check which WCAG levels pass.

Frequently asked questions

What ratio do I need?
At least 4.5:1 for normal text (AA) or 7:1 for AAA.
What counts as large text?
18pt regular or 14pt bold and above.

Related tools