Color accessibility

Accessible color is not a checklist bolted on at the end — it is a constraint that makes palettes better. Everything here computes real WCAG 2.1 math and the APCA candidate algorithm, in your browser, for free.

Contrast Checker

WCAG AA/AAA and APCA side by side, closest passing shade, best-text suggestions and a full N×N palette matrix.

Color Blindness Simulator

Protanopia, deuteranopia, tritanopia and achromatopsia simulations (Machado et al. 2009) plus ΔE00-based palette risk flags.

Accessible palette guides

A practical checklist for building palettes that hold up: contrast-first design, OKLCH ramps, CVD checks, never hue-only meaning.

WCAG contrast explained

The actual formula, the AA/AAA thresholds, and where the ratio breaks down (and why we also show APCA).

Quick facts

WCAG 2.1 AA requires 4.5:1 for normal text, 3:1 for large text and UI components; AAA requires 7:1 / 4.5:1.
Roughly 1 in 12 men and 1 in 200 women have some form of color vision deficiency — charts and status colors are the usual failure points.
Never encode meaning in hue alone: pair color with an icon, label or pattern (WCAG 1.4.1).
The contrast ratio is polarity-blind and perceptually crude — APCA is the modern refinement, which is why both are shown.