Palette Accessibility Checker

Palette Accessibility Checker measures every color in a palette against a single white surface and marks each one as passing or failing AA at 4.5 to 1.

What is Palette Accessibility Checker?

Palette Accessibility Checker takes a palette and measures every color in it against white, reporting the ratio for each and marking it pass or fail at 4.5 to 1. It is the reviewer's view of a palette rather than the designer's: one column of swatches, one fixed surface, and a tick or a cross for each entry.

The palette is editable and starts populated, so the page is useful immediately and can be pointed at a real set:

• Five colors are seeded to begin with, covering a blue, a purple, a red, a green and an amber.
• Each entry can be replaced by picking a new color in its row.
• Entries can be removed individually with the button beside each row.
• Additional colors can be added, each one generated at random and then editable in place.

Every measurement is taken against white, which is fixed rather than configurable, and each row prints the hex value in upper case alongside the ratio to two decimal places and a tick or cross for the 4.5 to 1 AA line. The arithmetic is the standard WCAG 2.x contrast ratio: each color is converted to sRGB, its channels are linearised, the linear values are weighted 0.2126 red, 0.7152 green and 0.0722 blue into a relative luminance, and the lighter plus 0.05 is divided by the darker plus 0.05 before rounding to two decimals.

Because the surface never changes, the results have to be read with the page's assumption in mind.

• White is hardcoded. Every ratio describes a color on white, so a dark-theme palette will show almost everything failing, which says nothing about how those colors behave on a dark surface.
• One surface only. The matrix of every color against every other color is not produced, so text-on-brand combinations still need their own check.
• AA at 4.5 to 1 is the only threshold. There is no large-text allowance, so a color intended for headings is judged at the stricter figure, and AAA is not reported at all.
• The tick is binary. A color at 4.51 to 1 and one at 15 to 1 look identical in the list.
• Results are not exported, so anything you want to keep has to be copied out by hand.
• The palette has no fixed size, which means a long one has to be scrolled rather than summarised.

Use this page to sweep a light-theme palette in one pass and find the entries that cannot carry text on white. For text on a dark surface, reverse the roles and check the pairs individually, and for a boundary rather than text, the component check applies the right threshold.

As a palette contrast checker the page is fast by design: a fixed surface, one threshold and a binary verdict per color. That combination makes it a sound first pass over a light theme and a poor one over a dark theme, and the distinction is worth holding on to. A palette aa contrast sweep against white answers exactly one question, which is which of these colors can carry text on a light surface, so the fastest way to use it is to check palette against white once, replace the failures, and hand the surviving colors to the pair checks for the surfaces they will really sit on.

How to use Palette Accessibility Checker

1. Review the seeded palette of five colors, replacing any entry whose row does not match your own set.
2. Add colors with the add button when your palette is longer than five, then edit each new entry in place.
3. Read the contrast against white column, where every color shows its hex value, its ratio to two decimal places and a tick or cross for 4.5 to 1.
4. Remove the entries you have already dealt with using the button beside each row, so the remaining failures are the only thing on screen.

When to use Palette Accessibility Checker vs related tools

Use the palette accessibility checker to sweep a whole light-theme palette in one pass and find which colors cannot carry text on white. A single pair belongs with the contrast checker, the components built from those palette colors belong with the UI component contrast checker, finding replacements for the entries that fail is the accessible color pair finder, and confirming that a passing color reads well as text is the text readability checker.

Privacy & Security

This tool runs entirely in your browser — no data ever leaves your device. There is no server round-trip, no upload, no logging, and no account required. Your input is processed locally using client-side JavaScript and is never stored, transmitted, or accessible to anyone else. When you close the tab, everything disappears.

Frequently asked questions about Palette Accessibility Checker