Category Colors

A free, browser-based optimizer for categorical color palettes: colors for chart series, map categories, tags and legends that stay distinguishable from one another, including for people with color vision deficiencies.

What it does

Category Colors generates palettes of 2 to 20 colors with simulated annealing, maximizing the perceptual distance between every pair. You can fix brand colors and let it choose the rest, limit the color space, lightness and saturation, require contrast against a background, and avoid particular colors. It checks every pair under normal vision and simulated protanomaly, deuteranomaly, tritanomaly and grayscale, previews the palette on live charts, and exports it as CSS custom properties or W3C design tokens.

How to use it

The app needs JavaScript. Developers can use the same optimizer through the open-source category-colors npm package. AI agents can read llms.txt, or connect to the MCP server at https://categorycolors.com/mcp (Streamable HTTP, no auth) to generate, fix, check and export palettes. In a browser that supports WebMCP (document.modelContext), this page registers the same tools, plus ones that load a palette into the app, so the person can watch it change.

The method is explained in How to pick the least wrong colors, by Matt Ström-Awn.