Accessible Color Palette Generator
Generate palettes where every color passes WCAG contrast.
Generate an Accessible Color Palette
Pick a background and a target contrast level, and this tool generates a palette of distinct colors that every one passes WCAG contrast against that background — so any of them is safe to use for text or UI.
How it works
- Spreads hues evenly around the color wheel
- Adjusts each color's lightness until it meets your threshold
- Reports the exact contrast ratio for each
- Targets AA (4.5:1), AA large (3:1), or AAA (7:1)
Reading the ratios
Each swatch shows its contrast ratio against your background. 4.5:1 is the AA minimum for normal text, 3:1 for large text and UI components, and 7:1 is the stricter AAA level.
Why contrast matters
Low contrast is one of the most common accessibility failures on the web. Text that doesn't stand out from its background is hard to read for people with low vision, color vision deficiencies, or anyone in bright sunlight. Starting from a contrast-safe palette prevents the problem at the source.
Computed locally
Contrast is calculated with the official WCAG relative-luminance formula, entirely in your browser. Click any swatch to copy its HEX value.
Frequently Asked Questions
Common questions about the Accessible Color Palette Generator.