What is a color harmony?

Color harmony refers to the arrangement of colors based on their position on the color wheel. Analogous colors sit next to each other (calm, cohesive), complementary are opposite (high contrast), and triadic are evenly spaced (vibrant, balanced).

Can I export the palette for CSS?

Yes. Click "Export CSS" to download a .css file with all colors as CSS custom properties (variables) ready to paste into your project.

What color formats are supported?

You can view and copy colors in HEX (#14b8a6), HSL (hsl(174, 79%, 40%)), or CSS variable format.

How do I find a complementary color?

Select your base color, choose "Complementary" from the harmony dropdown, and click Generate. The tool calculates the color directly opposite on the HSL color wheel.

🎨

Color Palette Generator

Generate harmonious color palettes online. Choose from analogous, complementary, triadic, and more. Export as CSS, HEX, or HSL. Free color scheme generator.

Generate Palette

Base Color

Harmony

Count: 5

About This Tool

Generate beautiful, harmonious color palettes from any base color. Choose from 7 harmony modes — analogous, complementary, triadic, split-complementary, tetradic, monochromatic, or random. Export your palette as CSS variables, HEX codes, or HSL values.