Color Palette Generator
3 colors: the base and its neighbours 30° either side
Palette
About
Color harmonies are combinations defined by positions on the color wheel - complementary colors sit opposite each other, analogous colors sit side by side, and triadic colors are evenly spaced a third of the way round. This tool uses the HSL hue wheel: it rotates the hue of your color and keeps its saturation and lightness, except Monochromatic, which keeps the hue and saturation and changes only the lightness.
How to use
1.
Enter a base color as hex, rgb() or hsl(), or click the swatch to pick one
2.
Choose a Harmony - the caption under the choices says how many colors it makes and how they relate
3.
Pick HEX, RGB or HSL in the Palette header, then tap a swatch to copy its value, or click Copy all for the whole palette, one color per line
Common uses
▸
Generating a starting color scheme for a new project
▸
Finding accent colors that pair with an existing brand color
▸
Getting darker and lighter versions of one hue with Monochromatic
Similar tools
Frequently asked questions
What is a complementary color scheme?
Complementary colors sit opposite each other on the color wheel, which gives the strongest hue contrast. Here the complement is the base hue plus 180° at the same saturation and lightness, so the default blue #3B82F6 pairs with the orange #F6AF3B. The HSL wheel is not the red-yellow-blue wheel painters use, so pure blue #0000FF pairs with yellow rather than orange.
How many colors does each palette contain?
Complementary makes 2 colors; Analogous, Triadic and Split complementary make 3; Tetradic makes 4; and Monochromatic makes 5. Every palette includes your base color, labelled Base, and labels the others by how they relate to it (Complement, +120°, Lightness 75% and so on).
What is a monochromatic palette?
A monochromatic palette keeps one hue and saturation and varies only the lightness. This tool keeps your base color and adds four more between 10% and 90% lightness, split between darker and lighter versions according to how much room your color leaves on each side - black gets four lighter swatches, white four darker ones, and a mid-tone two of each.
Why are all the swatches the same color?
Your base color is a grey, white or black - it has 0% saturation, so it has no hue. Complementary, Analogous, Triadic, Tetradic and Split complementary all work by rotating the hue, which changes nothing on a grey. Pick a color with some saturation, or choose Monochromatic, which varies lightness instead.
Is my data sent to a server?
No. All palette generation runs in your browser, and no data is sent anywhere.