Paletten-Generator

Erzeuge harmonische Farbpaletten (Komplementär, Analog, Triadisch, Abstufungen und mehr) aus jeder Basisfarbe, mit CSS-Export.

Base color

Scheme

Colors

Click a swatch to copy its hex value.

CSS

:root {
  --color-1: #25e7eb;
  --color-2: #25a5eb;
  --color-3: #2563eb;
  --color-4: #2925eb;
  --color-5: #6b25eb;
}

So funktioniert es

Choose a base color with the swatch or by typing its HEX value.
Pick a scheme such as complementary, analogous or triadic. Shades, tints and analogous also let you choose how many colors to generate.
Click any swatch to copy that color's HEX value.
Copy the whole palette as CSS variables (--color-1, ...) or as a plain HEX list.

Hinweise

Palettes are computed from hue-wheel angles and HSL lightness. Complementary rotates the hue by 180 degrees, triadic by 120-degree steps, and analogous shifts within a ±40-degree window. Shades step lightness down and tints step it toward white. Everything is generated locally in your browser.

Häufige Fragen

Why do some schemes ignore the color count?: Complementary (2), triadic (3), split-complementary (3) and tetradic (4) palettes have their size fixed by hue geometry. Only analogous, shades and tints can vary the count freely.
Is my palette saved anywhere?: No. The palette disappears when you leave the page, so copy it as CSS variables and paste it into your own project if you want to keep it.