Color Palette Generator
Generate harmonious colour palettes using complementary, analogous, triadic and monochromatic rules. Lock colours and export.
Press Space to generate a new palette. Lock a swatch to keep it.
:root {
}About Color Palette Generator
Generate a five-colour palette built on colour-theory relationships rather than pure chance. Lock the colours you like and regenerate the rest until the set works, then export as HEX, CSS custom properties or Tailwind config.
How to use it
- Pick a harmony rule, or start from a base colour.
- Press Space or Generate for a new palette.
- Lock any colour you want to keep.
- Export as HEX list, CSS variables or Tailwind tokens.
Frequently asked questions
Which harmony rule should I choose?
Analogous for calm, cohesive interfaces. Complementary when you need a strong accent against a dominant colour. Triadic for playful, high-energy brands. Monochromatic when structure should come from tone rather than hue.
How many colours does a UI actually need?
Usually three: a neutral for surfaces and text, one brand colour, and one accent for actions. Five gives you room for semantic states such as success and error.
Are the palettes accessible?
Each swatch shows its contrast ratio against black and white, so you can see immediately whether text will pass WCAG AA on that colour.
Trending guides
In-depth reads that go beyond the calculator.
- Trending6 min read
SIP Calculator guide
A Systematic Investment Plan is a standing instruction to put a fixed amount into a mutual fund on the same date each month. That is the whole idea. It is not a product you buy, not an asset class, and not a scheme with a guaranteed rate — it is a schedule. The returns come from whatever the underlying fund holds.
- 3 min read
BMI Calculator guide
Body Mass Index is weight in kilograms divided by height in metres squared. That is the whole calculation. It was devised in the 1830s by the Belgian statistician Adolphe Quetelet, who was explicitly describing populations rather than assessing individuals — a distinction that matters enormously and gets lost constantly.
- 3 min read
Percentage Calculator guide
Almost every percentage problem is one of four shapes. Knowing which one you are looking at is most of the work, because each has a different formula and mixing them up is where the wrong answers come from.