Free Color Accessibility Auditor

Audit a palette for risky text and background combinations.

Run palette contrast audit

Enter hex colors separated by commas, spaces, or new lines.

Reference

WCAG contrast thresholds are 4.5:1 for normal AA text, 3:1 for large AA text, 7:1 for normal AAA text, and 4.5:1 for large AAA text. See the W3C contrast guidance.

Workflow Notes

Best for

  • Design systems that need a fast pass on many brand colors before assigning text, card, surface, and call to action roles.
  • UI teams doing checkpoint reviews who need explicit pass/fail evidence for contrast issues and want exportable audit rows for documentation.
  • Designers evaluating multiple themes or dark/light variants and needing a quick pairwise map of where contrast breaks down.
  • Product teams preparing handoff packages where accessible contrast proof is expected from engineering and QA without running external automation.

Check before using it

  • Decide on the exact color candidates you want tested and keep temporary placeholders out of the input list to reduce noise.
  • Convert any brand palette tokens, shorthand values, or named colors to full 6-digit hex first, because the tool only validates that format.
  • Set a target text size context first, then map planned roles. The tool always computes AA, AAA, and large text thresholds but you should still filter based on your real UI.
  • Keep at least two valid colors in the list because the audit requires foreground and background combinations.

Review the output

  • Confirm the summary numbers match expectation: number of colors, generated pair count, and AA normal-text failures should align with the mathematical combinations from your input.
  • Open at least one sample swatch row per critical color family to verify that the ratio output matches the visual sample for readability and intent.
  • Check AA and AAA outcomes separately. A pair can pass AA but fail AAA; record why the stricter bar matters for your page type and audience.
  • Cross-check export completeness by pasting CSV into a spreadsheet and verifying all columns are present for audit traces: foreground, background, ratio, AA, AAA, large text.

Limits to keep in mind

  • Only hex colors are supported, so CSS tokens, gradient names, rgba, hsl, and image-based samples are out of scope until converted to hex.
  • The audit is pairwise and palette level only; it does not evaluate full component contrast in context of fonts, letter spacing, font weight, or animated states.
  • The logic applies WCAG numeric thresholds but cannot replace human review for readability, icon contrast, icon-on-surface behavior, motion states, or branded exception decisions.
  • Output is generated from browser-side formulas and does not include enterprise policy checks for legal risk scoring, accessibility audits per route, or accessibility roadmap.

Handoff

  • Move to Contrast Checker when you need a focused test on one foreground and one background pair for detailed debugging.
  • Use Color Palette Extractor when your next step is converting assets or screenshots into candidate hex values before a rerun of the palette check.
  • Use Design Token Converter when finalizing tokens into frontend formats so the approved accessible palette can be consumed by design system config.
  • Attach the CSV result to design docs before closing ticket status, then route to engineering with role assumptions for each color pair.

How to Use

  1. Open the tool and paste or type colors in one list using commas, spaces, or line breaks. Use only 6-digit hex values, for example #117c80 and #ffffff.
  2. Click Audit Colors to generate pairwise results for every valid foreground and background combination in the palette, excluding matching color pairs.
  3. Scan the summary for the total number of pairs and AA failures so you can quickly estimate whether the palette is feasible for body text use.
  4. Review each row in the result table by reading the preview cell and the AA, AAA, and large text columns to spot exactly which color choices are safe, risky, or blocked for current
  5. Use Copy CSV to capture the output, then paste it into notes or a design ticket and rerun after small palette edits to track deltas.

FAQ

Is Color Accessibility Auditor free?

Yes. It runs in the browser and does not require an account.

What does it do?

Browser-based audit that checks palette hex pair contrast against WCAG thresholds, flags pass or fail, previews swatches, and exports CSV.

What should I use next?

Usually Contrast Checker is the next step when you want to validate whether a specific text color and background color are readable together by calculating WCAG contrast values for normal and large text directly in the browser before you.

Is Color Accessibility Auditor free to use and does it require an account?

Yes. It is free, browser based, and runs without login or account gating.

What input format works, and what happens if a color is invalid?

The input accepts hex codes separated by commas, spaces, or new lines. Invalid or shorthand values are ignored, so your list should use full six-digit hex for reliable coverage.

How should I use AA, AAA, and large text results?

Use AA for general body text baseline, AAA for stricter readability goals, and Large for larger font sizes such as headlines. Choose the strictness based on real component specs, not only one passing ratio.

What if many rows fail but visually look close to readable?

Do not treat near misses as acceptable. Adjust one color at a time, rerun immediately, and keep the strongest passing combinations until every critical UI role is covered.

Related Tools

Related Guides

Next useful step

Continue the Workflow

When this step is finished, move to the tool that handles the next production risk.

Privacy

This tool runs in your browser, and inputs stay on your device until you choose to copy or download the result.

Update Log