Color Contrast Checker

Design Tools

WCAG contrast ratio for text & background

FreePrivateInstant
Text color
Background color
Full guide, 3 min readIs your text readable? The contrast ratio, explainedRead the story behind this tool →

Similar tools you may like

History

All history →

Color Contrast Checker — at a glance

Make sure people can actually read your text. Test any two colors against accessibility standards.

Colors
Text #374151
Background #FFFFFF
Calculate
Ratio
10.3 : 1
AAA ✓

How to use it — step by step

A text color and a background color.

1

Enter your numbers

Fill in the fields — sensible example values are already filled in.

2

Pick your options

Choose any dropdowns or switches that apply to your case.

3

Check Contrast

Press the button. The result is created instantly on your device.

4

Read the answer

The main answer is shown big at the top, with details below it.

Pro tips

Small things that make the result better.

✦Aim for at least 4.5 : 1 for normal body text.
✦Large text (24px, or 19px bold) needs only 3 : 1.
✦Never rely on color alone to carry meaning.

Quick facts

WCAG 2standard formula
AA & AAAboth levels
Large textseparate rule
Freeno signup

Frequently Asked Questions

What is a good contrast ratio?+

At least 4.5 : 1 for normal text (AA) and 7 : 1 for the stricter AAA level.

What counts as large text?+

About 18pt (24px) regular or 14pt (18.7px) bold and above.

Why does contrast matter?+

Low contrast is hard to read for many people, especially in bright light or with low vision.

Is this tool really free?+

Yes — completely free, no signup, no watermark and no usage limit.

More Free Tools