Color Palette Generator
Free color palette generator: create harmonious palettes (analogous, complementary, triadic and more), lock the colors you like and export HEX or CSS.
Also: Palette from Image and Color Picker · Color Contrast Checker
What it does
This generator creates color palettes for websites, apps, presentations and designs. Choose a harmony to build colors that go together from a base color, or press the space bar for random palettes, and lock the colors you like so that only the others change. Colors are calculated in the OKLCH color space, which keeps the perceived lightness even when the hue changes, so the palettes look balanced. Copy the colors as HEX, CSS variables or JSON, or share the palette with a link.
How to use it
- Choose a harmony and a base color, or keep Random.
- Press the space bar or Generate until you like the palette; lock the colors you want to keep.
- Click a color code to copy it, or copy the whole palette as HEX, CSS or JSON.
Frequently asked questions
What do the harmonies mean?
They are classic combinations from the color wheel. Analogous uses neighbouring hues for a calm look; complementary uses opposite hues for strong contrast; triadic and tetradic spread three or four hues evenly; split complementary softens the complementary pair; monochromatic uses one hue in several shades.
Why OKLCH and not HSL?
In HSL, a yellow and a blue with the same lightness value look very different in brightness. OKLCH is designed around human perception, so turning the hue keeps the colors equally light. It is the color space added to CSS for this reason.
Can I check if the colors are readable?
Yes: use the contrast checker to see whether text in one color on a background of another meets the WCAG accessibility levels.