Why use OKLCH for a color scale?
OKLCH separates lightness, chroma, and hue, which makes shade progression easier to reason about than RGB interpolation.
Perceptual color
Generate balanced OKLCH shades from a single color
Create predictable lightness steps while keeping every generated color inside the sRGB gamut used by the web.
- Perceptually smoother light-to-dark progression
- sRGB-gamut-clamped values for dependable browser output
- HEX, CSS variable, Tailwind, and Figma token exports
Portable OKLCH tokens
--color-teal-100: oklch(0.93 0.04 190);
--color-teal-500: oklch(0.62 0.12 190);
--color-teal-900: oklch(0.32 0.06 190);Frequently asked questions
Can I export HEX values too?
Yes. Every palette can also be copied as HEX values.