Contrast Checker

Compare the contrast ratio of two colors and see whether they pass WCAG AA and AAA.

Check contrast

Text color

Background color

Large text sample

Normal text sample

—

Contrast ratio between the text color and the background color.

AA normal—

AA large—

AAA normal—

AAA large—

Ratios follow the WCAG 2.1 relative luminance formula and range from 1:1 to 21:1.

Set the text color with the color box or by typing its hex code.
Set the background color the same way, or press Swap to exchange the two.
Read the contrast ratio and the pass or fail badges for AA and AAA at normal and large text sizes.

Common questions about the free online contrast checker.

It is a measure of the difference in brightness between two colors, expressed from 1:1 for identical colors up to 21:1 for black on white.

AA requires at least 4.5:1 for normal text and at least 3:1 for large text.

AAA requires at least 7:1 for normal text and at least 4.5:1 for large text.

Large text means 18 point, about 24 pixels, or 14 point bold, about 18.66 pixels.

Each color is converted to relative luminance with the WCAG formula, then the lighter value plus 0.05 is divided by the darker value plus 0.05.

Darken the text or lighten the background, or the other way round, and check the ratio again until it reaches the level you need.

This tool focuses on text contrast. Interface components and meaningful graphics need a ratio of at least 3:1 under AA.

No. The calculation happens entirely in your browser.

Yes, the contrast checker is completely free with no sign up.

Last updated: October 10, 2026