Toolsy

Color contrast checker for WCAG

Favorite

Color contrast checker tests text and background pairs for WCAG AA and AAA. Pick two colors, see the ratio instantly, and fix weak combos. Free online tool.

The quick brown fox

Normal body text sample.

17.40:1

  • Normal text: AAA
  • Large text: AAA
WCAG 2 contrast: AA needs 4.5:1 for normal text, 3:1 for large text. AAA is 7:1 / 4.5:1. This is a color check, not a full accessibility audit.

How it works

  1. 1

    Enter your data

    Text, a link, or settings — right on this page.

  2. 2

    Instant result

    Everything runs on your device. We do not get a copy.

  3. 3

    Copy or save

    Use it right away.

Need more room?

Pro lifts daily file caps. Plus adds keyword research when you outgrow free checks.

See plans — from $9/mo

Why people use Toolsy

Fast

You get the result in a second. No waiting in a line.

Private

Browser tools stay on your device. Uploaded files are processed and discarded with the response.

No sign-up

Open the page and start. An account is only for paid plans.

Other tools

Why use a color contrast checker before you ship

Gray text on a light background looks fine on your laptop but fails for many readers. A color contrast checker shows the ratio before users complain.

Pick foreground and background colors. See AA and AAA pass or fail for normal and large text sizes.

A color contrast checker is a quick check, not a full audit. Test buttons, links, and hover states on their own too.

Good for

  • Web buttons
  • Form labels
  • Brand palettes
  • Dark mode pairs

Tips

  • Test body text and headings
  • Check hover and focus states
  • Try both light and dark themes
  • Aim for AA at minimum

Common questions

What is a color contrast checker?

It compares a text color and a background color and shows if they pass WCAG AA and AAA rules.

How do I use a color contrast checker?

Enter or pick two colors. The tool shows the contrast ratio and pass or fail grades for normal and large text.

What contrast ratio does a color contrast checker need for AA?

Normal text needs about 4.5:1. Large text needs about 3:1 under WCAG AA.

Is this color contrast checker the same as the presentation contrast checker?

No. This tool checks two colors and a ratio. The presentation tool reviews whole slide PDFs for tiny type and weak colors.

Does a color contrast checker work with hex codes?

Yes. Paste hex values or use the color picker. The ratio updates as you change either color.

Color Contrast Checker Free Online — Toolsy