Why does my heading pair fail here when it looks acceptable?

Because this page applies the 4.5 to 1 normal-text minimum to everything it is given. WCAG 2.1 AA allows 3 to 1 for large text, so a heading pair in the 3 to 1 to 4.5 to 1 range is permitted but will still show as Fail here. Check those pairs against the large-text threshold instead.

Is a pass here enough to claim WCAG 2.1 AA conformance?

No. It confirms the contrast minimum for one text pair. AA covers many other requirements, and even within contrast it also sets a 3 to 1 requirement for non-text elements, which this check does not look at.

What happens if my pair lands exactly on 4.5 to 1?

It passes. The comparison is greater than or equal to the threshold, and both the ratio and the threshold are read at two decimal places, so an exact match is a pass rather than a borderline case.

Does the checker account for text color over a gradient?

No. It measures two solid colors. For text sitting on a gradient, check the lightest and darkest points separately and treat the worst result as the one that governs the pairing.

Should I darken the text or lighten the background to reach the threshold?

Either changes the ratio, but they are not equivalent in practice. Adjusting the larger area usually costs less visually, so lightening a dark background slightly is often the cheaper fix, while darkening the text is the better choice when the background is locked by a brand palette.

WCAG 2.1 AA Checker

Foreground

Background

WCAG 2.1 AA

14.68:1

Pass (≥ 4.5:1)

Sample text here

You Might Also Need

WCAG 2.1 AAA Checker

Pass/fail WCAG 2.1 AAA contrast

Large Text Contrast Checker

Contrast threshold for headings & large text

Contrast Checker

Check contrast ratio between two colors

WCAG 3.0 APCA Checker

Preview APCA-style perceptual contrast

WCAG 2.1 AA Checker gives a single pass-or-fail verdict against the 4.5 to 1 contrast minimum that WCAG 2.1 AA sets for normal text.

What is WCAG 2.1 AA Checker?

WCAG 2.1 AA Checker gives one answer to one question: does this pair of colors reach 4.5 to 1, the contrast minimum that WCAG 2.1 AA sets for normal text. Instead of the four badges a general checker shows, this page compares your pair against a single fixed threshold and prints Pass or Fail beside it.

The AA level of WCAG 2.1 is the one most projects are held to, and it is defined across two conditions rather than one:

Normal text needs 4.5 to 1, which covers body copy, labels, table cells and anything else read at ordinary size.
Large text needs 3 to 1, where large means roughly 24px, or 18.66px when bold.

The verdict on this page is decided at 4.5 to 1 for every pair you enter, so the large-text allowance is not applied. That is a deliberate simplification for the common case of checking body copy, and it is also the one behaviour to know about before you use the result to sign off a heading.

The measurement behind the verdict is the standard WCAG 2.x contrast ratio. Both colors are converted to sRGB and linearised, then weighted 0.2126 red, 0.7152 green and 0.0722 blue into a relative luminance. The lighter luminance plus 0.05 is divided by the darker plus 0.05, and the result is rounded to two decimals before the comparison. Because the comparison is a hard boundary rather than a gradient, a pair at 4.49 to 1 fails and a pair at 4.5 to 1 passes, with nothing in between.

Read the result as a WCAG 2.1 AA contrast verdict for the pair, with the 4.5 to 1 contrast minimum as the only line being tested. Normal text contrast is the case the page is built around, which is why it applies that figure regardless of how large the text actually is. The verdict does not grade how far above the bar you land, so a pair at 4.5 to 1 and a pair at 12 to 1 are both simply Pass. When the margin between the two matters, the ratio printed beside the verdict is where that difference shows.

A few things sit outside what a single-threshold check can tell you.

Large text is judged at the same 4.5 to 1 as body copy here, so a heading pair that only reaches 3 to 1 reports Fail even though WCAG 2.1 AA permits it for large type.
AAA is not evaluated at all. A passing pair tells you nothing about whether it reaches the 7 to 1 enhanced level.
The check covers text contrast only. Component boundaries, focus indicators and graphical objects are governed by the non-text requirement and are not assessed.
Two colors are compared, with no alpha and no third surface behind them.
The verdict says nothing about size, weight or how the text is actually rendered.

Use this page when AA is the requirement you have agreed to and you want an unambiguous yes or no rather than a table. If the pair is a heading, check it against the large-text threshold instead, and if the pair is a boundary rather than text, the component and focus checks are the ones that apply.

How to use WCAG 2.1 AA Checker

Pick the foreground color first, in the field labelled Foreground.
Pick the background color in the second field.
Read the ratio in the panel heading, to two decimal places.
Check the Pass or Fail line beneath it, which compares the ratio against 4.5 to 1 and shows the threshold in the same sentence.

When to use WCAG 2.1 AA Checker vs related tools

Use the WCAG 2.1 AA checker when AA is the level written into the brief and you want a single verdict for a body-copy pair. Pair it with the WCAG 2.1 AAA checker when a project has to satisfy both levels, the large text contrast checker when the pair is a heading rather than body copy, and the contrast checker when you want all four thresholds side by side instead of one gate.

Privacy & Security

This tool runs entirely in your browser — no data ever leaves your device. There is no server round-trip, no upload, no logging, and no account required. Your input is processed locally using client-side JavaScript and is never stored, transmitted, or accessible to anyone else. When you close the tab, everything disappears.