Contrast Matrix

Paste your color palette, get an NxN WCAG contrast ratio matrix. See every combination at a glance.

How to Use
  1. Enter hex colors in the text area — one per line, or comma/space separated
  2. Optionally give each color a name: Primary #3b82f6
  3. Click "Build Matrix" to generate the contrast ratio table
  4. Green = AAA (7:1+), Yellow = AA (4.5:1+), Red = Fail
  5. Hover any failing cell to see the nearest passing color suggestion

Note: All processing happens locally in your browser. No data is sent anywhere.

Privacy

This tool runs entirely in your browser. No data is sent to any server.