Komplementärfarben & Farbpaletten
Starte mit einer Grundfarbe und erhalte ihre komplementären, triadischen, tetradischen, analogen und geteilt komplementären Farbschemata. Klicke auf ein Farbfeld, um seinen Hex-Code zu kopieren.
Komplementär
Triadisch
Tetradisch
Analog
Geteilt komplementär
So funktionieren diese Farbschemata
Jedes Schema entsteht, indem der Farbton auf dem Farbkreis gedreht wird. Die Komplementärfarbe liegt direkt gegenüber (180°): maximaler Kontrast, perfekt, um eine Schaltfläche oder ein Detail hervorzuheben. Ein triadisches Schema besteht aus drei Farben im Abstand von 120°, ein tetradisches Schema aus vier Farben im Abstand von 90°: lebendige und doch ausgewogene Paletten. Analoge Farben (±30°) liegen nebeneinander und wirken harmonisch und ruhig, während geteilt komplementäre Farben (150° und 210°) die Wucht der Komplementärfarbe in einer sanfteren, leichter handhabbaren Version liefern.
Praktische Tipps für den Einsatz einer Palette
Die einfachste Faustregel ist 60-30-10: eine dominante Farbe für etwa 60 % der Gestaltung (meist die neutralste oder deine Grundfarbe), eine Sekundärfarbe für 30 % und die kräftigste für nur 10 %, also Akzente und Handlungsaufforderungen. Wenn du diese Farben für Text verwendest, achte immer darauf, dass das Paar aus Text und Hintergrund lesbar bleibt: Zum Testen gibt es unseren WCAG-Kontrastprüfer.
Der Farbkreis der Maler und der des Bildschirms
Die Komplementärfarben, die man in der Schule lernt, stammen aus dem RYB-Farbkreis der Maler, bei dem Grün gegenüber von Rot liegt; am Bildschirm arbeitest du in RGB, wo Cyan gegenüber von Rot liegt. Es sind zwei verschiedene Modelle, und sie geben auf dieselbe Frage unterschiedliche Antworten.
Digitale Tools verwenden fast immer den HSL-Farbraum, also neu geordnetes RGB: Die Komplementärfarbe ist der Farbton, der 180 Grad entfernt liegt. Das Ergebnis passt zu dem, was ein Monitor zeigt, aber nicht zum Mischen von Pigmenten: Wer druckt, muss am richtigen Farbkreis neu rechnen.
Warum zwei reine Komplementärfarben das Auge ermüden
Zwei gegensätzliche Farben in voller Sättigung direkt nebeneinander erzeugen ein Flimmern an den Rändern: Das Auge kann nicht auf beide gleichzeitig scharfstellen, und die Grenze scheint zu vibrieren. Das ist der Effekt, der roten Text auf Grün unlesbar macht.
Das Paar funktioniert, wenn eine der beiden Farben entsättigt oder aufgehellt ist: Ein tiefes Blau mit einem sanften Orange beruht auf demselben Gegensatz, wirkt aber ruhig. Deshalb setzen Filmplakate seit zwanzig Jahren auf Orange und Petrol (Teal), nicht auf grelles Orange und grelles Blau.
Das Schema hängt davon ab, wie viele Farben du brauchst
Eine Komplementärfarbe soll eine einzige Sache hervorheben: eine Schaltfläche, einen Preis, eine Handlungsaufforderung. Gibt es mehr als ein Element in der Gegenfarbe, hebt sich der Akzent selbst auf: Wenn zwei Dinge schreien, schreit keines mehr.
Braucht es mehr Farben, gehst du ein Schema weiter: analog (benachbarte Farbtöne) für eine ruhige, stimmige Wirkung, triadisch für drei lebendige, aber ausgewogene Farben, geteilt komplementär für den Kontrast einer Komplementärfarbe ohne deren Härte. Bei mehr als vier Farben wirkt eine Palette nicht mehr wie eine bewusste Entscheidung.
Siehe auch
Bevor du ein Farbpaar übernimmst: Der WCAG-Kontrastprüfer sagt dir, ob der Text lesbar sein wird, und der Simulator für Farbenblindheit zeigt, ob es für alle funktioniert. Um eine Farbe heller und dunkler abzuwandeln, gibt es die Farbabstufungen.