Color Palette Generator

Generate harmonious color palettes with color-theory modes — lock the colors you love and shuffle the rest, then export CSS variables, SCSS, JSON or Tailwind.

Palette

Click a color to copy it. Lock the ones you love, then press Space to shuffle the rest.

#17693e

Forest

#7f3b8c

Purple

#bd4259

Rose

#80d09b

Mint

#eeaaf3

Lavender

Harmony

Colors

Start from a color

Value format

Export

Variables for your stack — copying saves to history.

:root {
  --color-1: #17693e;
  --color-2: #7f3b8c;
  --color-3: #bd4259;
  --color-4: #80d09b;
  --color-5: #eeaaf3;
}