Color palette generator
Pick a base color and a harmony rule to get a professional palette instantly. Lock what you like, hit Space for the rest.
Click any swatch to copy its value
Export palette
UI preview
See the palette applied to real interface elements to judge it fast.
Stop guessing your colors
A sample paragraph to judge readability and overall feel of this palette.
Color breakdown
| Name | HEX | RGB | HSL | CMYK | Luminance | Text color |
|---|
How the rules work
Analogous
Colors within 30° of each other on the wheel. The safest, most harmonious choice for unified interfaces and illustration.
Complementary
Colors opposite each other (180°). Maximum tension and contrast — ideal for call-to-action buttons and emphasis.
Triadic
Three colors spaced evenly 120° apart. Balanced yet vivid, a classic scheme for posters and brand systems.
Monochromatic
One hue, varying lightness and saturation. The most fail-safe option, common in data visualisation and minimal design.
About this tool
📘The palette generator builds a harmonious set from your base color using color-theory algorithms — great for brand palettes, UI themes and illustration.
- Pick a base color (or hit Random), then choose a harmony rule; when unsure, try Complementary or Triadic first.
- Tap the 🔒 on a swatch to lock the colors you like, then hit Regenerate or press Space to shuffle only the unlocked ones.
- When happy, Export to copy CSS / Tailwind variables, or open an image palette "in the generator" to keep editing.
Tips
💡- Pick a base color you like, then a rule; when unsure, try “Complementary” or “Triadic” — they are the safest.
- Lock a color you like with the 🔒 on its swatch, then “Regenerate” updates only the others.
- To reuse a curated set, open it in the generator from the Palettes library with one click.