Wie viele Paletten generiert das Tool?

Das Tool generiert 9 verschiedene Paletten aus einer einzigen Basisfarbe: monochromatisch, analog, komplementär, triadisch, split-komplementär, Pastell, dunkel, tonal (Material Design) und minimalistisch (Apple-Stil).

Was ist eine monochromatische Palette?

Eine monochromatische Palette besteht aus Variationen eines einzigen Farbtons - alle Farben haben denselben Farbton (H im HSL-Modell) und unterscheiden sich nur in Helligkeit und Sättigung. Diese Paletten sind harmonisch und eignen sich besonders für professionelle Designs.

Was ist eine komplementäre Palette?

Eine komplementäre Palette kombiniert die Basisfarbe mit ihrem Komplement - der auf dem Farbkreis gegenüberliegenden Farbe (180°-Versatz). Dieser Kontrast gehört zu den grundlegenden Prinzipien der Farbtheorie und erzeugt einen lebhaften, dynamischen Effekt.

Kann ich die generierten Farben kopieren?

Ja. Klicken Sie auf eine Farbe in der Palette, um den HEX-Code in die Zwischenablage zu kopieren. Sie können die Codes direkt in CSS, Figma, Adobe oder anderen Design-Tools verwenden.

Was ist der HSL-Farbraum?

HSL steht für Hue (Farbton), Saturation (Sättigung) und Lightness (Helligkeit). Im Gegensatz zu RGB beschreibt HSL Farben so, wie wir sie wahrnehmen: der Farbton bestimmt die Grundfarbe, die Sättigung die Intensität und die Helligkeit, wie hell oder dunkel die Farbe ist. Alle Paletten in diesem Tool basieren auf HSL-Berechnungen.

Was ist der Unterschied zwischen triadisch und split-komplementär?

Eine triadische Palette verwendet drei Farben, die auf dem Farbkreis gleichmäßig verteilt sind (je 120° Abstand). Eine split-komplementäre Palette nimmt statt des direkten Komplements die beiden Nachbarfarben des Komplements - das ergibt einen etwas subtileren Kontrast als das komplementäre Schema.

Farbpaletten-Generator

Wählen Sie eine Basisfarbe und generieren Sie 9 harmonische Farbpaletten. Monochromatisch, komplementär, triadisch, Pastell, dunkel und mehr - alle Berechnungen laufen lokal in Ihrem Browser.

Monochromatische Palette

Alle Farben haben denselben Farbton (H) und unterscheiden sich hauptsächlich in der Helligkeit (L) im HSL-Farbraum.

#0b28ba

hsl(230, 89%, 39%)

#153af2

hsl(230, 89%, 52%)

#4f6bf5

hsl(230, 89%, 64%)

#899cf8

hsl(230, 89%, 76%)

#c3ccfc

hsl(230, 89%, 88%)

Triadische Palette

Drei Farbtöne im Abstand von 120° auf dem Farbkreis (Eckpunkte eines gleichseitigen Dreiecks) - eine Geometrie, die häufig im Branding und Bauhaus-inspirierten Designs verwendet wird.

#4f6bf5

hsl(230, 89%, 64%)

#f43757

hsl(350, 89%, 59%)

#7ff667

hsl(110, 89%, 69%)

#f87f94

hsl(350, 89%, 74%)

#42f21f

hsl(110, 89%, 54%)

Split-Komplementärpalette

Eine Variante der Komplementärpalette - anstelle eines Komplements (180°) werden zwei Farben verwendet, die ca. ±30° vom Komplement verschoben sind, was die visuelle Spannung reduziert und gleichzeitig starken Kontrast beibehält.

#4f6bf5

hsl(230, 89%, 64%)

#f5864f

hsl(20, 89%, 64%)

#bef54f

hsl(80, 89%, 64%)

#f7a176

hsl(20, 89%, 72%)

#b0f328

hsl(80, 89%, 56%)

Pastellpalette

Derselbe Farbton mit reduzierter Sättigung und erhöhter Helligkeit - eine Verschiebung zur Mitte und zum oberen Bereich des HSL-Raums, die weiche, „cremige" Farben erzeugt.

#e1e5f4

hsl(230, 45%, 92%)

#d3d7ee

hsl(230, 45%, 88%)

#c4cae9

hsl(230, 45%, 84%)

#b5bde3

hsl(230, 45%, 80%)

#a6b0dd

hsl(230, 45%, 76%)

Dunkle Palette

Derselbe Farbton mit hoher Sättigung (S) und reduzierter Helligkeit (L) - eine Verschiebung nach unten auf der Helligkeitsachse, die tiefe Farben erzeugt, typisch für Dark Mode und kräftige Akzente.

#3757f4

hsl(230, 89%, 59%)

#153af2

hsl(230, 89%, 52%)

#0c2dd2

hsl(230, 89%, 44%)

#0a25ab

hsl(230, 89%, 36%)

#081d85

hsl(230, 89%, 28%)

Tonale Palette (Material Design inspiriert)

Mehrere Helligkeitsstufen eines Farbtons - variiertes L und moderates S, ähnlich den tonalen Bereichen aus den Material-Design-Richtlinien (z. B. 50-900).

#f2f3f8

hsl(230, 27%, 96%)

#dcdfef

hsl(230, 36%, 90%)

#b1bae7

hsl(230, 54%, 80%)

#7c8ee9

hsl(230, 71%, 70%)

#3e5df4

hsl(230, 89%, 60%)

Minimalistische Palette (Apple inspiriert)

Ein kräftiger Farbakzent und mehrere sehr helle, weiche Neutraltöne - ein Layout, typisch für Oberflächen mit viel Weißraum und dezenten Schatten.

#3e5df4

hsl(230, 89%, 60%)

#fafafa

hsl(230, 6%, 98%)

#efeff1

hsl(230, 6%, 94%)

#dfdfe2

hsl(230, 6%, 88%)

#484951

hsl(230, 6%, 30%)

Analoge Palette

Farben mit ähnlichen Farbtönen - von ca. -30° bis +30° um die Basisfarbe auf dem klassischen Farbkreis (z. B. Itten).

#4fbef5

hsl(200, 89%, 64%)

#67a3f6

hsl(215, 89%, 69%)

#4f6bf5

hsl(230, 89%, 64%)

#4637f4

hsl(245, 89%, 59%)

#864ff5

hsl(260, 89%, 64%)

Komplementärpalette

Die Basisfarbe und ihr Komplement, um 180° auf dem Farbkreis verschoben - einer der grundlegenden Farbkontraste, beschrieben u. a. von Johannes Itten.

#4f6bf5

hsl(230, 89%, 64%)

#1f42f2

hsl(230, 89%, 54%)

#f5d94f

hsl(50, 89%, 64%)

#f8e37f

hsl(50, 89%, 74%)

#f2cf1f

hsl(50, 89%, 54%)

Farbpaletten aus einer einzigen Farbe generieren

Der Farbpaletten-Generator erstellt aus einer einzigen Basisfarbe 9 verschiedene Farbpaletten auf Grundlage der Farbtheorie. Jede Palette hat eine andere Zusammensetzung - von monochromatischen Variationen bis hin zu kontrastierenden Komplementärfarben.

Alle Berechnungen basieren auf dem HSL-Farbraum (Hue, Saturation, Lightness). Der Farbton bestimmt die Grundfarbe, die Sättigung die Intensität und die Helligkeit, wie hell oder dunkel die Farbe erscheint. Dieses Modell entspricht der menschlichen Farbwahrnehmung und eignet sich hervorragend für die Palettengenerierung.

So verwenden Sie den Paletten-Generator

Die Palettengenerierung dauert nur wenige Sekunden:

1. Basisfarbe wählen
Geben Sie einen HEX-Farbcode ein oder verwenden Sie die Farbauswahl, um eine Basisfarbe festzulegen.
2. Paletten ansehen
Das Tool generiert automatisch 9 Paletten mit jeweils mehreren harmonischen Farben.
3. HEX-Codes kopieren
Klicken Sie auf eine Farbe, um den HEX-Code zu kopieren. Verwenden Sie ihn in CSS, Figma oder anderen Tools.

9 Palettentypen - welche passt zu Ihrem Projekt?

Jede Palette hat einen anderen Charakter und eignet sich für unterschiedliche Anwendungen:

Monochromatisch
Variationen eines Farbtons in Helligkeit und Sättigung. Elegant, harmonisch, professionell.
Analog
Benachbarte Farben auf dem Farbkreis. Sanfter, natürlicher Übergang ohne harten Kontrast.
Komplementär
Basisfarbe + gegenüberliegende Farbe (180°). Maximaler Kontrast für dynamische, lebhafte Designs.
Triadisch
Drei Farben im gleichmäßigen 120°-Abstand. Ausgewogen mit starkem visuellen Kontrast.
Split-komplementär
Basisfarbe + die zwei Nachbarn des Komplements. Subtilerer Kontrast als rein komplementär.
Pastell
Hohe Helligkeit, reduzierte Sättigung. Weich, luftig - ideal für freundliche und feminine Designs.
Dunkel
Geringe Helligkeit, tiefe Töne. Professionell, ernst - geeignet für Dark-Mode-Designs und Premium-Marken.
Tonal (Material Design)
Abgestufte Helligkeit bei gleichem Farbton. Ähnelt dem Farbsystem von Google Material Design.
Minimalistisch (Apple)
Neutrale Basis mit einem farbigen Akzent. Sauber, modern - inspiriert vom Apple-Designstil.

Beispiel: HSL(210, 80%, 50%)

H = 210° (Blauton)

S = 80% (kräftig)

L = 50% (mittlere Helligkeit)

Gleicher Farbton, andere Helligkeit

L: 90% → 70% → 50% → 30% → 10%

Wie der HSL-Farbraum funktioniert

Alle Paletten in diesem Tool basieren auf dem HSL-Farbraum (Hue, Saturation, Lightness). Im Gegensatz zu HEX oder RGB beschreibt HSL Farben so, wie wir sie wahrnehmen:

Hue (H) - der Farbton auf dem Farbkreis (0°–360°). 0° = Rot, 120° = Grün, 240° = Blau.
Saturation (S) - die Sättigung. 0% = Grau, 100% = volle Farbintensität.
Lightness (L) - die Helligkeit. 0% = Schwarz, 50% = Normalfarbe, 100% = Weiß.

Durch gezielte Änderung einzelner Werte lassen sich harmonische Paletten erzeugen. Monochromatische Paletten ändern nur L, analoge nur H, und komplementäre spiegeln H um 180°.

Wo können Sie die Paletten einsetzen?

Die generierten Farbpaletten eignen sich für verschiedene Anwendungsbereiche:

Webdesign
Konsistentes Farbschema für Ihre Website — Hintergrund, Text, Akzente und Schaltflächen.
Markenidentität
Aus einer Primärfarbe eine vollständige Markenpalette ableiten — für Print, Web und Social Media.
App-Design
Farbsystem für Ihre App erstellen — von der Navigation bis zu Benachrichtigungen.
Grafikdesign
Paletten als Ausgangspunkt für Poster, Flyer, Präsentationen und Infografiken nutzen.

Was macht diesen Paletten-Generator besonders?

9 Palettentypen
Monochromatisch, analog, komplementär, triadisch, split-komplementär, Pastell, dunkel, tonal und minimalistisch.
Basierend auf Farbtheorie
Alle Paletten folgen den Prinzipien der Farbtheorie - Farbkreis, HSL-Farbraum und bewährte Farbschemata.
Lokale Verarbeitung
Alle Berechnungen finden im Browser statt. Keine Daten werden an einen Server gesendet.
Ohne Limits
Beliebig viele Paletten generieren — ohne Registrierung und ohne Einschränkungen.

Häufig gestellte Fragen zum Farbpaletten-Generator

Weitere Tools entdecken

Alle Tools anzeigen

JPG/PNG-zu-WebP-Konverter

Reduzieren Sie die Dateigröße von Bildern ohne Qualitätsverlust. Konvertieren Sie JPG und PNG in WebP und beschleunigen Sie Ihre Website.

Farbpaletten-Generator

Farbpaletten aus einer einzigen Farbe generieren

So verwenden Sie den Paletten-Generator

1. Basisfarbe wählen

2. Paletten ansehen

3. HEX-Codes kopieren

9 Palettentypen - welche passt zu Ihrem Projekt?

Monochromatisch

Analog

Komplementär

Triadisch

Split-komplementär

Pastell

Dunkel

Tonal (Material Design)

Minimalistisch (Apple)

Wie der HSL-Farbraum funktioniert

Wo können Sie die Paletten einsetzen?

Webdesign

Markenidentität

App-Design

Grafikdesign

Was macht diesen Paletten-Generator besonders?

9 Palettentypen

Basierend auf Farbtheorie

Lokale Verarbeitung

Ohne Limits

Häufig gestellte Fragen zum Farbpaletten-Generator

Wie viele Paletten generiert das Tool?

Was ist eine monochromatische Palette?

Was ist eine komplementäre Palette?

Kann ich die generierten Farben kopieren?

Was ist der HSL-Farbraum?

Was ist der Unterschied zwischen triadisch und split-komplementär?

Weitere Tools entdecken

JPG/PNG-zu-WebP-Konverter

Online-Bildeditor

Favicon-Generator

Meta-Tag-Checker

Wort- & Zeichenzähler

E-Mail-Signatur-Generator

Farbkontrast-Checker

Bild-Farbextraktor