WCAG 2 vs APCA Contrast: What's the Difference?

Published July 20, 2026 · 8 min read · by the CSS DNA team

TL;DR: WCAG 2 measures contrast as a fixed luminance ratio (4.5:1 for AA body text) regardless of how the text looks. APCA — the perceptual model in the WCAG 3 draft — scores contrast on a Lightness contrast (Lc) scale and adjusts for text size, font weight and polarity (dark-on-light vs light-on-dark). WCAG 2 is what the law recognizes today; APCA better predicts what people can actually read. Audit against both.

How WCAG 2 contrast works

WCAG 2 computes the relative luminance of the text color and the background color and divides them, producing a ratio from 1:1 to 21:1. Thresholds are fixed:

Its strengths are simplicity and legal standing — accessibility regulations reference WCAG 2 today. Its weakness is that a single ratio ignores how vision actually works: 14px thin text and 32px bold text with the same ratio read very differently, and the formula is known to over-approve some dark-mode pairs while over-rejecting some light-mode ones.

How APCA works

APCA (Accessible Perceptual Contrast Algorithm) is the candidate contrast method for the WCAG 3 draft. Instead of a ratio, it produces an Lc value from roughly 0 to ±106, where higher magnitude means more contrast. Three things make it "perceptual":

• Polarity matters. Light text on dark backgrounds is scored differently (negative Lc) from dark-on-light, matching how our eyes perceive each.
• Size and weight matter. The Lc value you need depends on the font's size and weight — small thin text needs far more contrast than large bold text.
• Non-linear luminance. Its curve tracks perceived lightness more accurately than WCAG 2's formula, especially near black and near white.

Common working guidelines: Lc 90 for small body text, Lc 75 for regular body text, Lc 60 for large or bold text, and Lc 45 for very large headlines or non-text UI.

When the two models disagree

The interesting cases are where the verdicts flip:

• WCAG 2 passes, APCA fails. Mid-gray text on colored backgrounds and many light-on-dark pairs squeak past 4.5:1 but score a low Lc — text real users squint at.
• WCAG 2 fails, APCA passes. Large, heavy display text (say, 48px bold) can fall short of 4.5:1 yet be perfectly readable, which APCA's size/weight lookup recognizes.

This is why auditing with only one model gives a false sense of safety — and why CSS DNA reports both a WCAG ratio with AA/AAA badges and an APCA Lc score for every text/background pair it inspects.

Which should you use in 2026?

Auditing a whole palette at once

Checking pairs one at a time doesn't scale to a real design system. CSS DNA's audit builds a palette-vs-palette contrast grid from the tokens it extracts from any page, so you can see every failing combination under both models at a glance — and its contrast auto-fix suggests the nearest passing shade so your Tailwind theme ships accessible by default.