Accessible Palette Generator

Overview

Build a harmony palette from a base color and check every swatch against your background. Colors that fail WCAG AA are nudged toward a passing shade, keeping their hue as much as possible. It uses the same harmony engine as Palette Generator, with the contrast check built in.

Build an accessible brand paletteStart from your primary color and get a full palette that reads well on your site's background.
Fix a palette that fails an auditGet an adjusted version that clears WCAG AA without losing its overall character.

Key features

Harmony palette from a base color and background
Every swatch checked against WCAG AA
Failing colors adjusted to pass, hue kept
Adjusted swatches show their original color
Link straight to a palette with ?base=

Set

Color Tools 11

Neighbours

01 Accessible Text Color Finder 02 Brand Palette Accessibility Checker 03 Color Blindness Simulator 04 Color Converter 05 Color Editor 06 Complementary Color Generator

Specification

Command: color.accessible_palette_generator
Set: Color
Input: text
Output: —
Max file: no limit
Batch: single file

Runtime

Engine: native oklch
Threads: single
Isolated: —
WebGPU: —
Memory: —

Transport 0 B

Your file is opened, worked on and saved inside this tab. This tool has no upload step, so your file has nowhere else to go.

Keys

Search: ⌘K
Panels: ⌘1 · ⌘2
Full width: F
All keys: ⌘/

How it works

Pick base and background

Choose the color to build from and the background it will sit on.

Choose a harmony

Complementary, analogous, triadic, tetradic, split-complementary or monochromatic.

Check the result

Each swatch gets a pass/fail badge, and failing colors are nudged until they pass, keeping their hue where possible.

Frequently asked

How does the auto-adjustment work?

A failing color's lightness is moved in OKLCH, toward black or white (whichever raises contrast), until it reaches the target ratio. Hue and chroma stay as close to the original as possible.

What if a color can't be adjusted enough to pass?

You see the closest result, marked as not passing. The tool never claims a pass it couldn't reach.

Does this check AAA as well as AA?

The palette is checked against AA. For a pair's exact ratio and AAA status, open it in the Color Editor or Contrast Checker.

Keys

Search: ⌘K
Panels: ⌘1 · ⌘2
Full width: F
All keys: ⌘/