Farbpalette generieren

Erzeuge komplementäre, triadische und analoge Paletten aus einer Basisfarbe als HEX und CSS-Variablen.

KostenlosOhne Registrierung
Optionen
Palette

  • #646C3D

    hsl(70, 28%, 33%)

  • #4C6C3D

    hsl(100, 28%, 33%)

  • #3D6C44

    hsl(130, 28%, 33%)

  • #3D6C5C

    hsl(160, 28%, 33%)

  • #3D646C

    hsl(190, 28%, 33%)

CSS-Variablen
:root {
  --brand-1: #646C3D;
  --brand-2: #4C6C3D;
  --brand-3: #3D6C44;
  --brand-4: #3D6C5C;
  --brand-5: #3D646C;
}

Erzeuge komplementäre, triadische und analoge Paletten aus einer Basisfarbe als HEX und CSS-Variablen.

Das Problem beim Wählen einer Markenfarbe ist, dass eine Farbe eine Oberfläche nicht trägt. Dieses Tool leitet aus einer Basisfarbe eine vollständige Palette ab — analog, monochromatisch, komplementär, spaltkomplementär, triadisch und tetradisch — und gibt HEX, HSL und einfügbereite CSS-Variablen zurück.

So funktioniert's

  1. 1Wähle die Basisfarbe mit der Pipette oder durch Eingabe eines HEX-Werts.
  2. 2Wechsle zwischen den Schemata, um zu sehen, wie sich dieselbe Basis unter jeder Theorie auflöst.
  3. 3Kopiere das gesamte Set oder die CSS-Variablen in deine Design-Datei oder den Code.

FAQ

Verwandte Tools