Log in Sign up free

Color Palette Generator

Generate complementary, analogous, triadic, tetradic and monochromatic colour palettes from one colour.

Runs instantly in your browser — results update as you type.

How do I create a colour palette?

A colour palette generator uses colour-wheel relationships to find colours that work well together with a base colour, giving you a ready-made scheme for a website, brand or design.

Colour harmonies

  • Complementary — the opposite colour (180°). High contrast, great for call-to-action buttons.
  • Analogous — neighbours on the wheel (±30°). Calm and natural.
  • Triadic — three colours 120° apart. Balanced and vibrant.
  • Tetradic — four colours 90° apart. Rich; use one as the main colour.
  • Split-complementary — the base plus the two neighbours of its complement. Contrast with less tension.
  • Monochromatic — one hue at different lightness levels. Clean and consistent.

Click any swatch to copy its HEX code, or copy the CSS variables. All harmonies are listed in the table so you can compare them.

Use the 60-30-10 rule: 60 % main colour, 30 % secondary, 10 % accent. Check text readability with the Contrast Checker.

Frequently asked questions

Which harmony is best for a website?

Analogous or monochromatic palettes with one complementary accent colour are the easiest to use well.

Can I get shades of one colour?

Yes, choose Monochromatic, or use the Color Shades Generator for a full 50–950 scale.

How do I copy a colour?

Click its swatch.