WCAG Palette Auditor
Audit an entire color palette for WCAG accessibility at once: full pairwise contrast matrix, AA/AAA pass-fail badges, accessible-fix suggestions, and colorblind simulation.
How to use this tool
- Paste your palette as hex codes (one per line or comma-separated), or upload an image to extract colors.
- Read the matrix: each cell shows the contrast ratio and AA/AAA pass-fail badges for normal and large text.
- For any failing pair, use the suggested adjusted hex that reaches the AA 4.5:1 threshold.
- Toggle the colorblind simulation to check the palette for color-vision deficiency.
- Copy the URL to share the audited palette with your team.
Standard contrast checkers test one foreground/background pair at a time. The WCAG Palette Auditor audits your entire palette in one pass: it builds the full pairwise contrast matrix, so you instantly see which color combinations are safe to use together and which ones fail.
Every cell shows the WCAG 2.x contrast ratio with PASS/FAIL badges for AA and AAA normal text and AA large text. For each failing pair it suggests the nearest accessible adjustment — darkening or lightening the foreground just enough to pass 4.5:1. A built-in colorblind simulation (protanopia, deuteranopia, tritanopia) re-renders the swatches so you can sanity-check the palette for the ~8% of users with color vision deficiency.
Paste hex codes to audit instantly (works offline, nothing is uploaded), or drop in an image to auto-extract its dominant palette. Your palette is saved in the URL for easy sharing with your team. Built for designers, front-end developers, and accessibility specialists.
Frequently asked questions
- How is the contrast ratio calculated?
- Using the official WCAG 2.x formula: (L1 + 0.05) / (L2 + 0.05), where L is the relative luminance of each color computed from its linearized sRGB channels. AA requires 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1.
- Are my colors or images uploaded anywhere?
- No. Everything runs in your browser. Image palette extraction uses an in-page canvas and never sends the file to a server.
- How accurate is the colorblind simulation?
- It uses standard linear approximations of how protanopia, deuteranopia, and tritanopia shift color perception. It is a useful design check, not a clinical diagnosis.