Farbpaletten-Generator

Kostenloser Farbpaletten-Generator: harmonische Paletten (analog, komplementär, triadisch u. a.) erstellen, Farben fixieren und als HEX oder CSS exportieren.

Drücken Sie die Leertaste oder Generieren für neue Farben. Fixieren Sie die Farben, die Sie behalten möchten, und klicken Sie auf einen Code, um ihn zu kopieren.
Kopieren als

Außerdem: Farbpalette aus Bild und Farbpipette · Farbkontrast-Prüfer

Was er macht

Dieser Generator erstellt Farbpaletten für Websites, Apps, Präsentationen und Designs. Wählen Sie eine Harmonie, um aus einer Grundfarbe passende Farben abzuleiten, oder drücken Sie die Leertaste für zufällige Paletten, und fixieren Sie die Farben, die Ihnen gefallen, damit sich nur die anderen ändern. Die Farben werden im Farbraum OKLCH berechnet, der die wahrgenommene Helligkeit auch bei wechselndem Farbton beibehält – deshalb wirken die Paletten ausgewogen. Kopieren Sie die Farben als HEX, CSS-Variablen oder JSON, oder teilen Sie die Palette per Link.

So wird er benutzt

  1. Wählen Sie eine Harmonie und eine Grundfarbe, oder lassen Sie Zufällig eingestellt.
  2. Drücken Sie die Leertaste oder Generieren, bis Ihnen die Palette gefällt; fixieren Sie die Farben, die Sie behalten möchten.
  3. Klicken Sie auf einen Farbcode, um ihn zu kopieren, oder kopieren Sie die ganze Palette als HEX, CSS oder JSON.

Häufige Fragen

Was bedeuten die Harmonien?
Es sind klassische Kombinationen aus dem Farbkreis. Analog nutzt benachbarte Farbtöne für eine ruhige Wirkung; komplementär nutzt gegenüberliegende Farbtöne für starken Kontrast; triadisch und tetradisch verteilen drei oder vier Farbtöne gleichmäßig; split-komplementär schwächt das Komplementärpaar ab; monochrom nutzt einen Farbton in mehreren Abstufungen.

Warum OKLCH und nicht HSL?
In HSL wirken ein Gelb und ein Blau mit demselben Helligkeitswert sehr unterschiedlich hell. OKLCH ist auf die menschliche Wahrnehmung ausgelegt, sodass die Farben beim Drehen des Farbtons gleich hell bleiben. Aus diesem Grund wurde dieser Farbraum in CSS aufgenommen.

Kann ich prüfen, ob die Farben gut lesbar sind?
Ja: Mit dem Kontrast-Prüfer sehen Sie, ob Text in einer Farbe auf einem Hintergrund in einer anderen die Barrierefreiheitsstufen der WCAG erfüllt.

Wikipedia — Color scheme
Wikipedia — Oklab color space