Color palette generator
Generate a palette from any base color, lock the colors you like, and preview it on real UI. Every column links to its closest named color, and the whole palette exports to your stack.
Perceptually even hues in LCH. Pin colors to hold them, then generate.
Preview
Ship color systems that actually work.
A quick look at how this palette carries a real hero section, its type, and its calls to action.
Contrast matrix
Frequently asked questions
What is a color scheme?
A color scheme is a set of colors chosen by a rule about their positions on the color wheel — complementary (opposite), analogous (neighbouring), triadic (three evenly spaced), and so on. The rule gives the set a built-in sense of balance, which is why scheme-based palettes tend to feel intentional rather than random.
What does the "harmonious" scheme do differently?
Most generators rotate hue in HSL, where a fixed rotation can make one color much lighter or darker than the others. The harmonious mode rotates hue in LCH space instead, holding perceived lightness and chroma constant, so every color reads with the same visual weight.
How do I keep a color while regenerating the rest?
Click the pin icon on any column to lock it, then press Generate (or the spacebar). Locked colors are held in place while the unlocked columns are recalculated from the scheme.
How do I know if my palette is accessible?
The contrast matrix below the palette shows the WCAG contrast ratio for every pair of colors. Cells that pass AA for normal body text (a ratio of at least 4.5:1) are highlighted — those are the combinations safe to use for text on a background.
Can I share or save a palette?
Yes. The full palette and scheme are encoded in the page URL as you edit, so copying the link with the Share button captures exactly what you see. You can also export to CSS variables, a Tailwind config fragment, SCSS, JSON, a PNG strip, or Adobe .ASE and Photoshop .ACO swatch files.