Contrast Checker

Check the contrast ratio between a text color and a background color using the WCAG standard.

Text color
Background color
Contrast
1.00
Small text
Large text

Preview

This is how your text looks on the background you picked. Adjust the colors until it feels easy to read.

What is contrast ratio?

It measures the difference in brightness between two colors, shown as a ratio from 1:1 (no contrast) to 21:1 (maximum, black on white). The higher it is, the easier the text is to read.

What ratios does WCAG require?

For small text, level AA requires a ratio of at least 4.5:1 and level AAA requires 7:1. For large text (18 pt, or 14 pt bold), AA requires 3:1 and AAA requires 4.5:1. Meeting these minimums makes sure most people, including those with low vision, can read your content.

Preview

This is how your text looks on the background you picked. Adjust the colors until it feels easy to read.