Color Palette Generator
Generate harmonious colour palettes from a base colour using colour theory.
Click any swatch to copy HEX
How It Works
Enter a base colour or use the colour picker. Select a harmony rule (complementary, triadic, analogous, etc.) to generate a matching palette.
**Color Palette Generator — Build Beautiful Colour Schemes**
Choosing colours that work well together is one of the most challenging aspects of design. Colour theory provides proven rules for creating harmonious palettes. Our generator applies these rules automatically to any base colour you choose.
**Colour Harmony Rules**
**Complementary**
Two colours directly opposite on the colour wheel.
High contrast, vibrant, energetic. Used for calls-to-action against background.
Example: Blue (#0000FF) + Orange (#FF8000)
**Split-Complementary**
Base colour + two colours adjacent to its complement.
Slightly less contrast than complementary but more visual interest.
**Triadic**
Three colours equally spaced on the colour wheel (120° apart).
Vibrant and balanced. Works well for brands needing three distinct colours.
Example: Red, Yellow, Blue
**Tetradic (Square)**
Four colours equally spaced (90° apart). Rich colour scheme.
Requires careful balance — let one colour dominate.
**Analogous**
Three to five colours adjacent on the colour wheel.
Harmonious and natural-looking. Common in nature. Low contrast.
Example: Red, Red-Orange, Orange
**Monochromatic**
Variations in saturation and lightness of a single hue.
Cohesive and professional. Works well for minimalist designs.
**Tints and Shades Generator**
In addition to harmony-based palettes, our tool generates a full tint (lighter) and shade (darker) scale for any colour — perfect for building design system colour tokens.
**Tailwind CSS Colour Export**
Export any palette as Tailwind CSS configuration, with named colour values (100–900 scale) ready to paste into your tailwind.config.js.