Put your whole palette into one N×N audit table — WCAG ratios and APCA Lc for every foreground × background pair, decided at a glance.
| fg ↓ / bg → | |||||||
|---|---|---|---|---|---|---|---|
Ag1.0Lc0 | Ag4.2Lc+35 | Ag3.8Lc+31 | Ag5.2Lc+42 | Ag8.4Lc+62 | Ag1.2Lc0 | Ag17.4Lc+104 | |
Ag4.2Lc-33 | Ag1.0Lc0 | Ag1.1Lc0 | Ag1.3Lc0 | Ag2.0Lc+25 | Ag5.0Lc-34 | Ag4.2Lc+67 | |
Ag3.8Lc-29 | Ag1.1Lc0 | Ag1.0Lc0 | Ag1.4Lc+10 | Ag2.2Lc+30 | Ag4.6Lc-30 | Ag4.6Lc+72 | |
Ag5.2Lc-40 | Ag1.3Lc0 | Ag1.4Lc-11 | Ag1.0Lc0 | Ag1.6Lc+18 | Ag6.3Lc-41 | Ag3.3Lc+60 | |
Ag8.4Lc-61 | Ag2.0Lc-27 | Ag2.2Lc-32 | Ag1.6Lc-20 | Ag1.0Lc0 | Ag10.2Lc-62 | Ag2.1Lc+40 |
Rows = text color (foreground), columns = background. Each cell renders the real foreground-on-background pair with two accessibility metrics: WCAG ratio (AA body ≥ 4.5, AA large ≥ 3.0) and APCA Lc (75+ for body text, 60+ for large).
All candidate colors in one N×N matrix - accessibility for every foreground × background pair at once.
Bring in brand colors, semantic colors and neutrals (up to 10). Rows are foregrounds, columns are backgrounds.
Each cell shows WCAG ratio and APCA Lc. Dots light up: body text wants Lc 75+, large text 60+.
Record button pairs and body pairs into your design spec; eliminate failing combinations before they ship.
Three frequent questions in full-matrix audits.
Sink passing pairs into your semantic palette and spec.
WCAG 2.1 contrast validation between any foreground and background color.
Simulate 8 types of color vision deficiency to audit accessibility.
The de-facto standards of academic publishing — Okabe-Ito (recommended by Nature Methods), the Paul Tol series, the Nature NPG journal palette and the perceptually-uniform Viridis. Every swatch ships with an APCA contrast grade, and an 8-type color-vision simulator below verifies each palette live.
Feed one brand color, get primary / secondary / success / warning / danger — exported as Tailwind config and CSS variables.