Color Palette Generator
Generate complementary, triadic, analogous, and other color harmonies from a base color.
Color theory harmonies — complementary, triadic, analogous, and the rest — are really just fixed hue rotations on the color wheel: complementary is +180°, triadic is +120°/+240°, and so on. This rotates your exact starting hue by each formula instead of asking you to eyeball a color wheel, so the resulting palette shares your base color's saturation and lightness for a cohesive set rather than clashing generic swatches.
Example: Starting from a brand indigo (#4f46e5, hue 243°), the triadic harmony returns two companions at hue 3° (a coral red) and hue 123° (a green) — same saturation and lightness, so all three read as part of one deliberate palette rather than three unrelated colors.
How it works
- Pick a base color and a harmony type
- Hues are rotated around the color wheel in HSL on your device
- Copy each swatch's hex, or the whole palette as CSS custom properties
Frequently asked questions
Which color harmony should I use?
Complementary (opposite hues) gives the highest contrast and works well for a single accent against a dominant color; analogous (neighboring hues) reads as calm and cohesive; triadic and tetradic give more variety for data visualization or illustration where several distinct colors are needed at once.
How many colors does each harmony generate?
Complementary gives 2, analogous and triadic give 3, split-complementary gives 3, tetradic gives 4, and monochromatic gives 5 lightness steps of the same hue.
Is my color values uploaded anywhere?
No — Color Palette Generator runs entirely in your browser using JavaScript/WebAssembly. Your color values is never sent to a server.