What contrast ratio do I need?

WCAG AA requires 4.5:1 for normal text and 3:1 for large text and UI components. AAA requires 7:1 for normal text and 4.5:1 for large text.

What counts as large text?

WCAG defines large text as at least 24px regular or 18.66px bold.

Is a higher ratio always better?

Higher is more readable, but extreme contrast such as pure black on pure white can feel harsh for some readers.

Is Color Contrast Checker free to use?

Yes — Color Contrast Checker is completely free, with no registration, no usage limits and no watermarks.

Does this tool upload my files to a server?

No. All processing happens entirely in your browser — nothing is uploaded, stored or shared.

Color Contrast Checker

Check WCAG contrast ratio between text and background colours.

Text that is hard to read excludes users and can fail accessibility rules.

About Color Contrast Checker

Test the contrast between a text colour and a background against WCAG 2.1. See the exact ratio, a live text sample and clear pass/fail results for AA and AAA at normal and large text sizes — a quick accessibility check for any design.

Text that is hard to read excludes users and can fail accessibility rules. This contrast checker calculates the WCAG 2.1 contrast ratio between a text and a background colour and shows whether it passes AA and AAA.

How to use Color Contrast Checker

Choose or type the text colour and the background colour.
Read the contrast ratio and the live text sample.
Check the AA and AAA results for normal and large text and adjust colours until they pass.

Key features

Exact WCAG contrast ratio.
Pass/fail for AA, AAA, large text and UI components.
Swap button and live preview.

Common use cases

Checking brand colours against accessibility requirements.
Making sure buttons and links are readable.
Auditing a design before hand-off to developers.

Frequently asked questions

Related tools

Color Picker

Click any pixel in an image to get its exact color code.

Palette Generator

Extract a dominant color palette from any image.

CSS Gradient Generator

Create linear, radial and conic CSS gradients visually.

Color Converter

Convert colours between HEX, RGB, HSL, HSV, CMYK and OKLCH.