Color Palette Generator

Tailwind Color Palette Generator

Generate harmonious colors and export them as a complete tailwind.config.jsextension — colors named c1 toc5, ready to drop into your theme.

#40ddc8

hsl(172, 70%, 56%)

#e774d4

hsl(310, 71%, 68%)

#78bf22

hsl(87, 70%, 44%)

#4069dd

hsl(224, 70%, 56%)

#e77874

hsl(2, 71%, 68%)

:root {
  --color-1: #40ddc8;
  --color-2: #e774d4;
  --color-3: #78bf22;
  --color-4: #4069dd;
  --color-5: #e77874;
}

Exporting to Tailwind

Open the Export menu and pick Tailwind Config. The generator produces atheme.extend.colors block. Merge it into your tailwind.config.jsand use classes like bg-c1,text-c2 immediately.

Using the Tailwind export

  1. Generate a palette you like.
  2. Export → Tailwind Config → Copy code (or Download).
  3. Paste the exported object into your theme config.
  4. Use c1c5 anywhere in your markup.