Category: Developer tools
Color Palette Generator
Build a scheme around one colour
Pick a base colour and get a matching palette by colour-wheel relationship: complementary, analogous, triadic, tetradic, monochromatic or a ladder of shades. Copy any value as HEX, RGB or HSL.
- 1
#0f7b63 - 2
#7b0f26 - 3
#073b30 - 4
#3b0712 - 5
#17ba97
#0f7b63 #7b0f26 #073b30 #3b0712 #17ba97
The palette is calculated from the colour you enter. Nothing is uploaded.
Everything on this page is processed in your browser. Nothing is uploaded.
What this tool does
The relationships behind a palette are geometry on the colour wheel: a complement sits opposite the base, analogous colours sit either side of it, a triad is three points evenly spaced. Working that out by hand means converting to HSL, adding degrees and converting back, which is where the tinkering usually stops. The hue is rotated for you here, and when a scheme has fewer hues than the number of swatches you asked for, the lightness steps instead of a colour repeating, so five swatches from a complementary pair are still five usable colours. Every swatch carries a legible label and can be copied in whichever notation your stylesheet uses.
How to use it
- Pick or type the base colour to build around.
- Choose a scheme and how many colours you need.
- Copy an individual value, or the whole palette at once.
Privacy
This tool runs entirely in your browser. Your input is never uploaded, stored or shared — closing the tab removes it.
Frequently asked questions
- Which scheme should I start with?
- Analogous for a calm, related set, complementary when you need one accent that stands out, monochromatic when the interface should stay quiet and let the content lead.
- Are these palettes accessible?
- Not automatically. A scheme is about harmony, not contrast. Check any text and background pair with a contrast checker before shipping it.
- Is my colour sent anywhere?
- No. The palette is calculated in the page from the colour you enter, and nothing is uploaded or stored.