Color Palette Generator

Enter a color and generate beautiful palettes using color theory rules. Every swatch includes HEX, RGB, and CMYK — with warnings when colors may not print accurately.

Three hues evenly spaced — vibrant but balanced.

CMYK
#6D39AC

rgb(109, 57, 172)

cmyk(37,67,0,33)

Convert to CMYK →
CMYK
#AC6D39

rgb(172, 109, 57)

cmyk(0,37,67,33)

Convert to CMYK →
CMYK
#39AC6D

rgb(57, 172, 109)

cmyk(67,0,37,33)

Convert to CMYK →
CMYK
#BD9575

rgb(189, 149, 117)

cmyk(0,21,38,26)

Convert to CMYK →
CMYK
#3A7856

rgb(58, 120, 86)

cmyk(52,0,28,53)

Convert to CMYK →
:root {
  --color-1: #6D39AC;
  --color-2: #AC6D39;
  --color-3: #39AC6D;
  --color-4: #BD9575;
  --color-5: #3A7856;
}

Color tools

Palettes, gradients, accessibility checks, and print-ready conversions — all in one place.

How to build a brand palette

Start with your primary brand HEX from a style guide or logo file. Triadic is a strong default — three balanced hues that export cleanly to CSS or Tailwind. Switch to analogous for calm cohesion, or complementary for bold contrast against the opposite hue.

Check each swatch's CMYK column before handing colors to a print vendor. Use the HEX to CMYK converter for precise percentages, or open the contrast checker to validate text pairings for accessibility.

Color harmony rules explained

  • Triadic — three evenly spaced hues; vibrant but balanced for marketing sites and the default starting point.
  • Complementary — base plus its opposite, with tints and shades; high impact for CTAs and hero sections.
  • Analogous — neighboring hues; ideal for UI surfaces and soft gradients.
  • Monochromatic — one hue at different lightness levels; clean design systems and dashboards.

FAQ

Frequently asked questions

How to use the palette generator for web, brand, and print work.

What is a color palette generator?
A color palette generator creates harmonious color combinations based on color theory — complementary, analogous, triadic, and other schemes — from a single starting color.
Can I export palettes for CSS or Tailwind?
Yes. Copy your palette as CSS custom properties, a Tailwind theme.extend.colors block, or JSON design tokens.
Why do some colors show a CMYK warning?
Bright RGB and HEX colors often fall outside standard CMYK print gamuts. The warning means the color may shift when converted for offset or digital print.
How do I lock a color while regenerating?
Click the lock icon on any swatch. Regenerate will keep locked colors and vary the rest — useful when you have a fixed brand color.
Can I share my palette?
Use the share link to copy a URL with your seed color and harmony rule encoded. Send it to teammates or save it for later.