Palette Contrast Checker
Your whole palette, every text/background pairing, one WCAG matrix — ratios and AA/AAA verdicts at a glance.
| #3A332B | #C2612E | #FAF6F0 | #FFFFFF | |
|---|---|---|---|---|
| #3A332B | — | Aa 2.99 · Fail | Aa 11.55 · AAA | Aa 12.44 · AAA |
| #C2612E | Aa 2.99 · Fail | — | Aa 3.87 · AA large only | Aa 4.16 · AA large only |
| #FAF6F0 | Aa 11.55 · AAA | Aa 3.87 · AA large only | — | Aa 1.08 · Fail |
| #FFFFFF | Aa 12.44 · AAA | Aa 4.16 · AA large only | Aa 1.08 · Fail | — |
How to use this tool
- Paste 2–8 palette colors as HEX, one per line or comma-separated (extract them from an image with our Palette Extractor).
- Read the matrix: each cell is one text-on-background pairing, with its ratio and AA/AAA verdict.
- Design with the passing cells; treat failing cells as decoration-only pairings.
How it works
Every ordered pair in your palette is checked with the exact WCAG 2.2 formula. The matrix view exists because palettes fail in pairs, not alone — a palette where every color passes against white can still have no valid combination for a colored button with colored text. Seeing all pairings at once turns 'is my palette accessible?' into a lookup.
Sources & references
Content last reviewed: July 2026.
Frequently asked questions
How many of my palette pairs need to pass?
There's no quota — you need a passing pair wherever text sits on color. Most accessible palettes work by pairing every mid-tone with either a near-white or near-black neutral, rather than expecting mid-tones to pass against each other.
The diagonal is blank — why?
A color against itself is 1:1 by definition; it's omitted as noise.
What do AA and AAA mean in the cells?
AA (4.5:1) is the standard legal/regulatory bar for normal text; AAA (7:1) is the enhanced level. Cells also note when a pair passes only for large text (3:1).