# WCAG Color Contrast Check: AA and AAA Ratios

WCAG Color Contrast Check: AA and AAA Ratios is a SKILL.md that computes the real contrast ratio of every text and background pair in pasted CSS, design tokens or a palette, says whether each pair passes WCAG AA and AAA, and gives every failing pair a replacement color that passes on its real background; an agent buys it once for $0.05 over x402.

- Page: https://aiskills402.com/skills/wcag-color-contrast-check
- Category: Code & Engineering (https://aiskills402.com/categories/code)
- Price: $0.05 once, USD-priced, paid in USDC on Base over x402. Price as loaded on this page. The 402 response your agent receives is authoritative.
- Version: 1.0.1
- Card (JSON): https://api.aiskills402.com/v1/skills/wcag-color-contrast-check

## Use it when

Computes the real contrast ratio of every text and background pair in pasted CSS, design tokens or a palette, says whether each pair passes WCAG AA and AAA, and gives every failing pair a replacement color that passes on its real background. It carries a table of 256 channel values so the ratio is added and divided instead of guessed, and it reads the cases a glance gets wrong: a rgba color or opacity is blended with its background first, a placeholder is text, 18px bold is not large text, a border or an icon is a 3:1 component, a disabled control and a logo are exempt, short hex and color names are expanded, and 4.48 is never rounded up to 4.5. One line per pair, then a Verdict line. Use when asked for a WCAG color contrast check of a stylesheet, theme or palette, whether colors pass AA or AAA, or to fix text colors that are too pale.

## Not for

Reading markup for missing alt text, labels or keyboard access, and judging text on images, gradients or colors set by a script: you must say which color is behind the text. It reads the colors you paste and does not open your site. Color blindness simulation and APCA scores are not covered; the formula is WCAG 2.2.

## Tested, honestly

Tested 2026-11-12.

- Strong model (claude-sonnet-5-5 (Claude Code alias "sonnet")): Right on all 31 pairs in the 5 cases, read by hand against the formula. On the light CSS it put the fix for grey text on the tinted panel against the panel itself and gave the white-on-blue button a dark text colour; on the dark tokens it blended the transparent text and the opacity with the surface before taking the ratio; on the form it treated the placeholder as text, 18px bold as normal text, the border and the icon as 3 to 1 components and the disabled button as exempt; on the brand palette it expanded #abc-style short hex and the name gray, called the logo exempt and passed 24px regular text at 3.78. On the clean theme it answered that all pairs pass, including the two pairs just above 4.5. The ratio on the line was within 0.1 of the true one in all 31 pairs, and the closing Verdict line was exact in four of the five answers (in the fifth, the dark tokens, it added a remark after the line).
- Weak model (claude-haiku-5-5 (Claude Code alias "haiku")): Right on all 31 pairs, with the true ratio within 0.1 on every line and, for every pair marked failing AA, a fix that passes on the real background; the logo and the disabled button were written as exempt. Its closing line was less tidy than Sonnet's: in four of five answers it added a remark after the Verdict line.

Note: Five cases written by us on 12 November 2026 (four planted, one clean): a light stylesheet, dark-mode design tokens with rgba and opacity, a form stylesheet and a short brand palette, with 31 pairs in all; every borderline pair is at least 0.04 from its threshold. Correctness was scored by a script that applies the WCAG 2.2 formula (not by patterns): the AA verdict must match, a failing pair needs a fix colour that passes on the real background, and an exempt pair must not be called a failure; a second count also needs the ratio within 0.1. The script was first proved on its own: the anchors 4.542, 4.478, 2.849 and 21, the ideal answers pass, and every realistic wrong answer (about 4.5 passes, a fix that works only on white, rounding 4.499 up, 18px bold as large text, a placeholder at 3 to 1, transparency without blending) fails. The request names the pairs, asks for a ratio like 4.52:1, AA pass or AA fail and a fix colour; it does not give the formula or the thresholds. One run per model, case and side on 12 November 2026 (the side with the file was run twice, because the worked example in the file was reworded after the first run; both runs gave 31 of 31 for both models and the second is the one counted), and one earlier run of Sonnet alone without the file, before the file was written, which gave the same picture. The two public themes this idea came from have no rule for contrast; only with and without the file was compared. The skill's table of 256 values was generated by a script and checked against the four anchors; it is exact to 0.007 on 300000 random pairs.

### With and without the skill

Tested 2026-11-12.

- Color pairs judged right (31 pairs): Sonnet 31/31 with, 12/31 without; Haiku 31/31 with, 29/31 without.
- Cases that ended with a pair-by-pair answer (5 cases): Sonnet 5/5 with, 2/5 without; Haiku 5/5 with, 5/5 without.

Read by hand. Without the file Sonnet gave a right answer on the two cases where it answered (the light stylesheet and the dark tokens, all 12 pairs right), but on the other three, with no tools in the test, it wrote out calls to a shell to compute the ratios and never produced an answer, in both of two runs on the form and the brand palette and in the final run on the clean theme as well; the run on the form cost about $1.30 in tokens and the clean theme $1.66. Those pairs count as not answered. So what the file gives Sonnet is mostly the table that lets it finish the arithmetic itself, not new rules. Haiku without the file answered every case with the right verdicts and good fixes, but called the logo wordmark and the disabled button failures (2 pairs); it also computed a few ratios to 4.62 where the true one is 4.54 on a tinted footer, which stayed inside the pass verdict.

Same cases and the same checks with and without the skill. The cases are ours, written around what the skill is for; with a handful of cases, a difference of one or two is within noise.

Full summary: https://aiskills402.com/skills/wcag-color-contrast-check/tests

## Example

### English (claude-sonnet-5-5)

Before:

> /* app.css - Cashly dashboard, light theme */ :root {   --bg: #ffffff;   --panel: #eef2f7;   --ink: #1e293b;   --brand: #2b75ee;   --link: #3c6fdd;   --ok-bg: #e3f6e8;   --ok-ink: #1f7c46;   --soft: #677383;   --faint: #6a7482; } body { background: var(--bg); color: var(--ink); font: 16px/1.5 system-ui, sans-serif; } a { color: var(--link); }…

After:

> The ratios below were computed from the table in the skill. Only `btn-primary` needed a different kind of fix: white text can't reach 4.5:1 on `#2b75ee`, so the replacement text colour is a near-black. Darkening `--brand` would also work if you'd rather keep the white text. body: #1e293b on #ffffff — L 0.0218 / 1.0000 — 14.62:1 — normal text needs 4.5 — AA pass — AAA pass…

## What is in the file

- The pairs
- The ratio
- What the pair needs
- The fix
- The answer
- Worked example (an analogue, not your input)
- Limits

## Languages

Any language

## How to buy

Agent (HTTP):

1. GET https://api.aiskills402.com/v1/skills/wcag-color-contrast-check/file without a payment header. The answer is 402 with a PAYMENT-REQUIRED header (x402 v2): exact amount, asset, network, recipient.
2. Sign `accepts[0]` with an x402 client (for example @x402/core + @x402/evm).
3. Repeat the GET with the signature in the PAYMENT-SIGNATURE header. The answer is 200 with the file, its sha256 and a re-download token.

Agent (MCP): https://mcp.aiskills402.com/mcp — free tools search_skills, get_skill, redownload_skill. Buying itself is over HTTP.

Full flow: https://aiskills402.com/docs

## The file

- Version: 1.0.1
- Size: 10.3 KB (10575 bytes)
- SHA-256: 4733efc82e8780709132358bc22f465397b13bf72856998ef532afa4b33a6ca2
- Updated: 2026-11-13
- New versions are free through your re-download token.

## Versions

### 1.0.1 (2026-11-13)

One sentence in the input rules reworded (no rule changed, not re-tested): the end of the line on a pair with an unknown background shared five words with three free articles on our blog, and paid wording must not appear there.

### 1.0.0 (2026-11-12)

First release. The idea is ours (the owner's pick list of 12 November 2026); no foreign skill or repository was opened. The file carries a table of 256 channel values (generated by a script, checked against 4.542, 4.478, 2.849 and 21), the WCAG 2.2 formula as a short procedure, the thresholds by text size and component, the rules for transparency, placeholders, 18px bold, borders and icons, disabled controls and logos, and a fix rule computed against the real background. Output: one line per pair and a Verdict line.

Measured on 12 November 2026, five cases and 31 pairs, scored by a script that applies the formula (not by patterns): Sonnet 31 of 31 with the file, 12 of 31 without it (on three of five cases it tried to call a shell and gave no answer; where it answered, it was right); Haiku 31 of 31 with the file, 29 of 31 without it (a logo and a disabled button called failures). An earlier run of Sonnet alone without the file, before the file was written, gave 18 of 31 with the same two cases right and two without an answer. The side with the file was run twice (the worked example in the file was reworded after the first run to avoid shared wording with the answers; both runs gave 31 of 31 for both models, the second is the final file). No check was widened after the runs.

Public sources: see notes/ideas.md. The two public themes this idea came from have no rule for contrast, so only with and without the file was compared.

Price 50000 ($0.05), by the measured gain for Sonnet (19 pairs, but mostly through the missing arithmetic, not through new rules, and not owner-measured, so the lower of the two tiers).

## License

Perpetual, non-exclusive; use and modify for yourself incl. paid work; no resale or republishing. Holder: Georgi Kalchev, aiskills402.com. Terms: https://aiskills402.com/docs#license

## FAQ

### How is each pair reported?

One line per pair with the two luminances, the ratio, the size class and the AA and AAA verdicts, and for a pair that fails AA a replacement color with its own ratio on the same background. The last line is the verdict with the number of failing pairs, or all pairs passing. A fix is a neutral grey or near-black, so keep your own hue by checking a tint of it against the same background.

### Which cases does it read that a glance gets wrong?

Transparent colors and opacity are blended with the background before the ratio is taken. A placeholder counts as text, 18px bold does not count as large text, and an input border or a meaningful icon needs 3 to 1 against its neighbour. A disabled control and a logo have no requirement and get an exempt line. Short hex such as #abc and color names such as gray are expanded first, and a ratio of 4.499 is a fail, never rounded up.

### Does Claude Sonnet do better with this file?

It does, mainly by letting it finish the sums. Across 31 text and background pairs in five setups, Sonnet with the file judged all 31 right, each fix colour passing on the real background. Without it, Sonnet was right on the 12 pairs of the two setups it answered; on the other three it tried to call a shell for the arithmetic, which this test does not give, and returned no answer. Haiku went from 29 right to 31: alone it called a logo and a disabled button failures.

### How accurate is the table inside it?

It holds the 256 channel values with four decimals, generated by a script and checked against four known results: 4.54 for #767676 on white, 4.48 for #777777, 2.85 for #999999 and 21 for black on white. On 300000 random pairs the ratio from the table is off by at most 0.007, so a pair within 0.02 of a threshold is recomputed with more digits.

## Related skills

- [Accessibility Review: WCAG Defects in Markup](https://aiskills402.com/skills/accessibility-review.md): $0.03 once

## Measurement limits

- Models other than the two named above were not run.
- Each verdict comes from the test run on the date shown; the skill may have changed since (check the version).
- Full test inputs are not published here, only short excerpts of our own text.
- Results on your own texts, languages and domains can differ.

Offer note: Paid in USDC (USD-pegged) over x402 by an AI agent; one-time.
