# Triadische Farben und split-komplementäre Paletten erklärt

[Canonical HTML page](https://gradiently.design/de/guide/triadic-colors)

Drei gleichmäßig verteilte Farben können eine Palette zugleich kühn und ausgewogen wirken lassen oder wie eine Spielzeugkiste. Der Unterschied liegt fast nur darin, welche Farbe führt.

## The short version

- Triadische Farben sind drei Farbtöne, gleichmäßig um den Farbkreis verteilt, jeweils ein Drittel des Kreises voneinander entfernt, etwa Rot, Gelb und Blau im Malerfarbkreis.
- Eine triadische Palette funktioniert, wenn eine Farbe dominiert, eine zweite unterstützt und die dritte als kleiner Akzent dient.
- Zwei der drei Farben zu dämpfen ist der schnellste Weg, eine triadische Palette erwachsen wirken zu lassen.
- Eine split-komplementäre Palette nutzt einen Farbton plus die beiden Farbtöne neben seinem Gegenüber, das gibt starken Kontrast mit weniger Spannung.
- Triadische Farben wirken meist besser als getrennte Flächen denn gemischt in einem einzigen Farbverlauf.

**Triadische Farben** sind drei Farbtöne, gleichmäßig um den Farbkreis verteilt, jeder ein Drittel des Kreises von den anderen entfernt. Im Malerfarbkreis bilden Rot, Gelb und Blau eine Triade, ebenso Orange, Grün und Violett. Weil die drei gleich weit auseinanderliegen, überstrahlt keine die anderen allein durch ihre Position, deshalb wirken triadische Paletten lebendig und ausgewogen. Genau deshalb übertreibt man es aber auch leicht.

Dieser Leitfaden behandelt Triaden, die Regel, die sie davor bewahrt, wie eine Spielzeugkiste auszusehen, und das split-komplementäre Schema, einen nahen Verwandten, der sich leichter steuern lässt. Der Leitfaden zum [Farbkreis](https://gradiently.design/de/guide/color-wheel) erklärt die beiden Arten von Farbkreis, auf die sich der Text unten bezieht.

## Triadische Farbschemata im Farbkreis

| Triade | Farbkreis | Charakter |
| --- | --- | --- |
| Rot, Gelb, Blau | Malerfarbkreis (Primärfarben) | Kühn, grafisch, vertraut |
| Orange, Grün, Violett | Malerfarbkreis (Sekundärfarben) | Erdig, ungewöhnlich, reich |
| Rotorange, Gelbgrün, Blauviolett | Malerfarbkreis (Tertiärfarben) | Modern, weniger erwartbar |
| Rot, Grün, Blau | Bildschirm (RGB) | Technisch, laut in voller Stärke |
| Cyan, Magenta, Gelb | Bildschirm (RGB) | Wie Druck, verspielt |

Gängige Triaden. Dreh das Dreieck an eine beliebige Stelle des Kreises für weitere.

- Marineblau (Blau): #1e3a8a
- Senf (Gelb): #d4a017
- Ziegel (Rot): #b91c1c
- Oliv (Grün): #4d7c0f
- Pflaume (Violett): #6b21a8
- Gebranntes Orange: #c2410c

Die Primärtriade und die Sekundärtriade, jeweils aus der vollen Sättigung vertieft, damit sie besser zusammenpassen.

## Die Dominanzregel: eine Farbe führt

Drei helle Farben zu gleichen Teilen kämpfen um Aufmerksamkeit und wirken kindlich. Die Lösung ist, sie zu ordnen. Eine Farbe bedeckt den Großteil des Designs, eine zweite unterstützt, und die dritte erscheint nur dort, wo das Auge landen soll. Eine Aufteilung von 60, 30 und 10 ist ein guter Ausgangspunkt, wie bei der [60-30-10-Regel](https://gradiently.design/de/guide/60-30-10-rule).

- Gleiche Drittel: Konkurrenz: `linear-gradient(90deg, #b91c1c 0% 33.3%, #d4a017 33.3% 66.6%, #1e3a8a 66.6% 100%)`
- 60, 30, 10: Marineblau führt: `linear-gradient(90deg, #1e3a8a 0% 60%, #d4a017 60% 90%, #b91c1c 90% 100%)`
- 60, 30, 10: Oliv führt: `linear-gradient(90deg, #4d7c0f 0% 60%, #6b21a8 60% 90%, #c2410c 90% 100%)`

Dieselbe Art Triade in unterschiedlichen Anteilen. Ordnest du die Farben, wird aus Lärm eine Palette.

Welche Farbe sollte führen? Meist die dunkelste oder am wenigsten gesättigte, denn große Flächen einer hellen Farbe ermüden. Heb dir die hellste für den Akzent auf. Gehört deine Markenfarbe zur Triade, ist sie oft die naheliegende Führungsfarbe.

## Eine Triade dämpfen

Das zweite Werkzeug ist die Sättigung. Halte eine Farbe kräftig und zieh die anderen beiden Richtung Grau, dunkler oder heller. Die Struktur der Triade bleibt, die Palette wirkt also weiter ausgewogen, verliert aber die Grundschul-Buntheit. Viele redaktionelle und traditionsreiche Paletten sind verkleidete Triaden: Marineblau, Ocker und Ziegel oder Oliv, Pflaume und Rost.

- Tintenblau: #1f2a44
- Hafer: #e9dcc3
- Ocker: #b98b2e
- Ziegel: #9b3d33

Eine gedämpfte Primärtriade mit einem warmen Neutralton. Sie wirkt redaktionell statt verspielt.

## Wo triadische Paletten funktionieren

Triaden passen zu Marken und Projekten, die energisch, offen oder verspielt wirken wollen, ohne zufällig auszusehen: Bildung für Kinder, Spiele, Festivals, Essen und Gemeinschaftsprojekte. Sie sind auch nützlich für Systeme, die drei klar getrennte Kategorien brauchen, etwa drei Produktlinien, drei Kursstufen oder drei Arten von Veranstaltungen, weil jede Farbe so weit wie möglich von den anderen beiden entfernt ist.

- **Drei Kategorien:** Gib jeder ihre eigene Farbe der Triade und halte die Layouts identisch, damit die Farbe sortiert.
- **Eine Marke, eine Führungsfarbe:** Nutze die Führungsfarbe überall und hol die anderen beiden für Illustrationen, Diagramme und Hervorhebungen dazu.
- **Plakate und Verpackungen:** Eine gedämpfte Triade auf warmem Neutralton gibt ein gedrucktes Gefühl wie aus der Mitte des Jahrhunderts. Plane die Farben für Druckfarbe, siehe [Farbverläufe drucken](https://gradiently.design/de/guide/print-gradients).
- **Oberflächen:** Behalte die Triade für Status und Illustration und lass Neutraltöne die Screens tragen, sonst wirkt jede Seite laut.

## Split-komplementäre Farben

Ein split-komplementäres Schema beginnt mit einem Farbton und nutzt statt seines direkten Gegenübers die beiden Farbtöne rechts und links davon. Du behältst den Großteil des Kontrasts eines [komplementären Paares](https://gradiently.design/de/guide/complementary-colors), verlierst aber den frontalen Zusammenstoß und gewinnst eine dritte Farbe dazu. Es ist eines der nachsichtigsten Schemata für Einsteiger.

- Basis: Violett: #5b21b6
- Split: Limette: #a3e635
- Split: Bernstein: #f59e0b
- Neutral: Fliederweiß: #f5f3ff

Das Gegenüber von Violett im Malerfarbkreis ist Gelb. Das Split-Schema nutzt die Farben rechts und links davon, Limette und Bernstein.

- **Basisfarbe:** die Führung, für den Großteil des Designs.
- **Erste Split-Farbe:** Unterstützung, in kleineren Flächen oder in ruhigerer Version.
- **Zweite Split-Farbe:** der Akzent, sparsam eingesetzt.
- **Neutralton:** ein fast Weiß oder fast Schwarz, das alles zusammenhält.

## Triadische Farben in Farbverläufen

Mischst du alle drei Farben einer Triade in einem Farbverlauf, muss der Übergang durch jeden Farbton dazwischen, und mindestens ein Übergang wird meist stumpf. Triaden funktionieren besser als getrennte Flächen oder als zweifarbiger Verlauf mit der dritten Farbe als Akzent.

- Alle drei gemischt: trübe zweite Hälfte: `linear-gradient(90deg, #b91c1c 0%, #d4a017 50%, #1e3a8a 100%)`
- Marineblau in Ziegel, über Pflaume: `linear-gradient(135deg, #1e3a8a 0%, #6b2a6e 55%, #b91c1c 100%)`
- Senf als hart abgesetzter Akzent: `linear-gradient(135deg, #1e3a8a 0%, #6b2a6e 50%, #b91c1c 86%, #d4a017 86%, #d4a017 100%)`

Zwei Farben der Triade gehen ineinander über, die dritte steht für sich. Die Hälfte von Gelb zu Blau im ersten Beispiel zeigt, warum.

## Fehler bei triadischen Paletten

### Vermeiden

- Drei gesättigte Farben zu gleichen Teilen
- Text in der Akzentfarbe
- Alle drei in einem Farbverlauf gemischt
- Kein Neutralton, auf dem das Auge ruhen kann

### Besser

- Eine Führung, eine Unterstützung, ein Akzent
- Text in einem Neutralton mit starkem Kontrast
- Getrennte Flächen oder zwei gemischt plus ein Akzent
- Ein fast Weiß oder fast Schwarz daneben

Wirkt eine Triade immer noch zu laut, geh einen Schritt zurück zu einer [analogen Palette](https://gradiently.design/de/guide/analogous-colors), in der die Farben Nachbarn sind statt Gegenüber.

## FAQ

### Was sind triadische Farben?

Triadische Farben sind drei Farbtöne, gleichmäßig um den Farbkreis verteilt, jeweils ein Drittel des Kreises voneinander entfernt, etwa Rot, Gelb und Blau im Malerfarbkreis.

### Wie nutzt man ein triadisches Farbschema?

Lass eine Farbe dominieren, eine zweite unterstützen und die dritte als kleinen Akzent wirken. Dämpfst du zwei der drei, lässt sich mit der Palette leichter leben.

### Was ist ein split-komplementäres Farbschema?

Ein Basisfarbton plus die beiden Farbtöne rechts und links seiner Komplementärfarbe. Es behält starken Kontrast mit weniger Spannung als ein direktes Komplementärpaar.

### Was ist der Unterschied zwischen triadischen und komplementären Farben?

Komplementär nutzt zwei gegenüberliegende Farbtöne, triadisch drei gleichmäßig um den Kreis verteilte. Triaden sind abwechslungsreicher und meist etwas weniger spannungsgeladen.