Color Palette Generator
Generate complementary, analogous, triadic, split-complementary, tetradic, and monochromatic color palettes from any base color. Free online color harmony tool.
Complementary
Two colors directly opposite on the color wheel — high contrast.Analogous
Three colors adjacent on the wheel — harmonious and natural.Triadic
Three colors evenly spaced 120° apart — vibrant and balanced.Split-Complementary
Base color plus two colors adjacent to its complement — softer contrast.Tetradic
Four colors forming a rectangle on the wheel — rich and complex.Monochromatic
Shades and tints of a single hue — clean and elegant.Click any swatch to copy its HEX value.
What Is a Color Palette Generator?
A color palette generator derives harmonious color schemes from a single base color using color theory rules. Different harmony types (complementary, analogous, triadic, etc.) produce palettes with distinct visual characteristics suited to different design contexts.
How to Use
- Enter a HEX color (e.g.
#3b82f6) or use the color picker - Six harmony types are generated simultaneously
- Click any color swatch to copy its HEX value
- Hover a swatch to see HEX and RGB values
Harmony Types
- Complementary — opposite on the wheel, maximum contrast
- Analogous — adjacent colors, natural and cohesive
- Triadic — 120° apart, vibrant and balanced
- Split-Complementary — softer alternative to complementary
- Tetradic — four colors in a rectangle, complex and rich
- Monochromatic — shades and tints of the same hue
FAQ
How are the harmonies calculated?
The input color is converted to HSL (hue–saturation–lightness). Harmonies are produced by rotating the hue by specific angles (e.g. 180° for complementary, 120° for triadic) while keeping saturation and lightness stable.
Which harmony is best for UI design?
Analogous palettes work well for calm, professional UIs. Complementary is great for call-to-action elements. Monochromatic suits minimal designs.
Can I enter an RGB or HSL color?
Currently HEX input only. Use the color picker to visually choose any color, which will automatically populate the HEX field.