About

OpenColor is a design token engine for designers and developers who care about color. Give it one to four key colors and it derives a complete, production-ready token system from formulas. It started as a personal project to bridge the gap between raw color inspiration and a design system you can actually ship. It is free to use, with no account and no sign-up.

What is OpenColor?

OpenColor turns a single key color into a complete set of design tokens — backgrounds, text, borders, actions, feedback states, and more — all calculated in the OKLCH color space for perceptual uniformity. Every token is WCAG-aware, dark-mode ready, and exportable as Markdown, DTCG JSON, CSS variables, Style Dictionary, or a Tailwind config.

How it works

Pick a preset from our curated collection or bring your own colors. OpenColor's formula engine derives every token from your key colors using OKLCH transforms — lightness, chroma, hue, and contrast — so your entire palette stays coherent as your brand evolves. No manual tweaking, no guesswork.

The preset collection

The preset library is drawn from thousands of named colors, filtered down to the ones that produce a harmonious, usable token set across both light and dark modes. Every preset in the library is open to everyone, with no limit on how many you can browse.

Color space

All token generation happens in OKLCH — a perceptually uniform color space where equal steps in lightness look equal to the human eye. This means your design system will be visually balanced across all hues, not just technically correct.