COLOR CONTRAST CHECKER

Does your text pass WCAG?

Check the contrast ratio between two colors against WCAG AA and AAA standards, using the official formula.

Text color

Background color

Sample heading text

This is what regular body text looks like with these colors.

21.00

contrast ratio

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

How this is calculated

The contrast ratio is computed using the official WCAG formula: the relative luminance of each color is calculated from its linearized sRGB values, and the ratio is (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color. This is the exact method browsers and accessibility auditing tools use.

What do AA and AAA mean?

AA is the standard most websites aim for: 4.5:1 for regular text, 3:1 for large text (18pt or larger, or 14pt bold). AAA is a stricter standard used for content requiring higher accessibility: 7:1 for regular text, 4.5:1 for large text.