The method
How it works
Palette Clinic measures; it does not guess. Every color becomes numbers, and every finding is a calculation you can check by hand.
- Contrast, WCAG 2
- Each sRGB channel is linearized, then weighted by how strongly the eye's cones respond:
Y = 0.2126 R + 0.7152 G + 0.0722 B. Contrast is the ratio(Y₁ + 0.05) / (Y₂ + 0.05). The pass lines are 4.5:1 for text and 3:1 for interface parts. - Contrast, APCA
- A newer model from the draft WCAG 3. It reports lightness contrast as Lc, and it is polarity-aware: dark text on light and light text on dark score differently, because the eye does not treat them alike. Targets here are Lc 75 for body text, 60 for labels and 45 for interface parts.
- Perceptual color space
- Distances in RGB do not match what people see. OKLab is built so that equal numeric steps look about equally different. OKLCH is the same space as lightness, chroma and hue angle. A color difference, ΔE, is the straight-line distance between two colors in OKLab. It drives the near-duplicate, loudness and brand-drift checks, and the vibration check, which catches vivid, different hues of similar lightness that appear to shimmer at their edge.
- Color-vision deficiency
- Protan, deutan and tritan vision are the loss or shift of the long-, medium- or short-wavelength cone response. The Machado, Oliveira and Fernandes (2009) matrices transform linear RGB to simulate each. Two colors are flagged when they are distinct to typical vision but fall within a small ΔE once simulated.
- Hue harmony
- Hue angles are read from the OKLCH wheel. Six harmony patterns are rotated through every angle and scored by how far each color sits from its nearest slot. Larger patterns are penalized, so they win only when they explain the colors better. Colors pulled from an image are found by k-means clustering in OKLab.
- The fix
- The fixer takes the smallest step that works. It changes OKLCH lightness in increments of 0.004 from your color, holds hue and chroma, and stops at the first value that meets the target, then tells you how far it moved. Colors you lock are never touched.
What it cannot see. It measures colors as an sRGB screen shows them. It knows nothing about the room's light, the viewer's eyes, or how a paper, ink or vinyl will reproduce a color, so treat a pass as an early warning, not a guarantee. The contrast thresholds are conventions, APCA is still a draft, and the harmony, loudness and vibration limits are adjustable design heuristics.
Your palette
Edit a hex code, click a swatch to pick a color, paste a list, or import from an image. Lock any color you do not want the fixer to touch.
Diagnosis
Every check runs on measured values: lightness, chroma, hue, contrast and color vision. Fixes keep what they can and tell you what they change.
Hue and lightness
The wheel shows where each color sits and which harmony pattern fits best. The ladder shows whether the palette has a real range from light to dark.
Contrast
Every text and background pairing, scored with WCAG 2, APCA or both. Select a pair to see it at real sizes and fix it.
Roles and preview
Give each color a job. The preview uses your roles, in light and in dark, on a landing page, a dashboard and a form.
Shade ramps
Eleven steps per role, each built to hit a set contrast against white, so every step has a known job. Click a step to add it to your palette.
System tokens
Hover, pressed, disabled, focus ring, links and status colors, derived from your roles and checked in light and dark.
Color vision
How the palette looks to people with common types of color blindness.
Report and method
A record of what passed, what changed and how far it moved, plus the math behind every check.
Take it with you
Copy or save the finished palette as code or design tokens, with dark-mode values and shade ramps included.