# Farbharmonie: warum manche Farben zusammengehören [Canonical HTML page](https://gradiently.design/de/guide/color-harmony) Der Farbkreis liefert dir sechs klassische Farbschemata. Sie helfen, aber sie sind nur die halbe Harmonie. Die andere Hälfte sind Helligkeit, Sättigung und wie viel du von jeder Farbe nutzt. ## The short version - Farbharmonie ist die Eigenschaft einer Gruppe von Farben, die aussehen, als gehörten sie zusammen. - Die sechs klassischen Harmonien sind monochrom, analog, komplementär, geteilt komplementär, triadisch und tetradisch, jeweils definiert durch Positionen im Farbkreis. - Farbtonbeziehungen allein garantieren keine Harmonie: Farben brauchen auch eine sinnvolle Verteilung der Helligkeit und eine kontrollierte Sättigung. - Eine dominante Farbe mit kleineren Anteilen der anderen wirkt fast immer harmonischer als gleiche Anteile aller Farben. - Farben mit gemeinsamem Unterton, etwa einem Hauch Wärme oder desselben Farbtons, wirken verwandt, selbst wenn sie im Farbkreis weit auseinanderliegen. **Farbharmonie** ist das Gefühl, dass eine Gruppe von Farben zusammengehört. Designer bauen sie meist auf zwei Wegen: Sie wählen Farbtöne in einer bekannten Beziehung im Farbkreis, etwa Nachbarn oder Gegenüber, und sie gleichen alles andere aus, also Helligkeit, Sättigung und wie viel von jeder Farbe erscheint. Stimmt das Erste und das Zweite nicht, wirkt das Ergebnis trotzdem schief. Stimmt beides, wirken selbst ungewöhnliche Kombinationen ruhig und gewollt. ## Der Farbkreis und warum er hilft Der Farbkreis ordnet Farbtöne im Kreis an, sodass Beziehungen zu Geometrie werden. Nachbarn teilen viel vom selben Licht und verschmelzen weich; Gegenüber teilen nichts und lassen sich gegenseitig intensiver wirken. Jede klassische Harmonie ist eine Form, die über den Kreis gelegt wird. Wenn dir der Farbkreis selbst neu ist, starte mit [dem Farbkreis](https://gradiently.design/de/guide/color-wheel). Ein Farbkreis: `conic-gradient(from 0deg, #e64545, #e6a645, #c8e645, #45e66a, #45e6d4, #4596e6, #6a45e6, #d445e6, #e64545)` Farbtöne in mittlerer Stärke rund um einen Kreis. Jede Harmonie unten ist ein Muster aus Punkten auf diesem Ring. ## Die sechs klassischen Farbharmonien Hier ist jedes Schema aus derselben Petrol-Basis `#30a69c` gebaut, damit du siehst, wie die Beziehung die Stimmung ändert, während die Ausgangsfarbe bleibt. - Monochrom: `linear-gradient(90deg, #d7f4f1 0% 25%, #88ddd6 25% 50%, #30a69c 50% 75%, #1d635d 75% 100%)` - Analog: `linear-gradient(90deg, #30a661 0% 33.3%, #30a69c 33.3% 66.6%, #3075a6 66.6% 100%)` - Komplementär: `linear-gradient(90deg, #30a69c 0% 50%, #a6303a 50% 100%)` - Geteilt komplementär: `linear-gradient(90deg, #30a69c 0% 33.3%, #a63075 33.3% 66.6%, #a66130 66.6% 100%)` - Triadisch: `linear-gradient(90deg, #30a69c 0% 33.3%, #9c30a6 33.3% 66.6%, #a69c30 66.6% 100%)` - Tetradisch: `linear-gradient(90deg, #30a69c 0% 25%, #6130a6 25% 50%, #a6303a 50% 75%, #75a630 75% 100%)` Jeder Streifen zeigt die Farbtöne des Schemas bei gleicher Sättigung. Achte darauf, wie viel lauter die Schemata werden, je weiter die Farbtöne auseinanderliegen. | Harmonie | Farbtöne im Kreis | Wirkung | Schwierigster Teil | | --- | --- | --- | --- | | Monochrom | Ein Farbton, viele Helligkeitsstufen | Ruhig, edel, einheitlich | Flachheit vermeiden | | [Analog](https://gradiently.design/de/guide/analogous-colors) | Drei Nachbarn, etwa 30 Grad auseinander | Natürlich, warm oder kühl, einfach | Genug Kontrast erreichen | | [Komplementär](https://gradiently.design/de/guide/complementary-colors) | Zwei Gegenüber, 180 Grad auseinander | Kräftig, energiegeladen | Verhindern, dass die Farben kämpfen | | Geteilt komplementär | Eine Basis plus die zwei Nachbarn ihres Gegenübers | Lebendig, aber weicher als komplementär | Entscheiden, welche Farbe führt | | [Triadisch](https://gradiently.design/de/guide/triadic-colors) | Drei Farbtöne, 120 Grad auseinander | Verspielt, ausgewogen | Bei voller Stärke kindlich wirken | | [Tetradisch](https://gradiently.design/de/guide/tetradic-colors) | Zwei Komplementärpaare | Reich, komplex | Vier Farben zusammenhalten | Jedes Schema hat einen eigenen Artikel mit Codes und Beispielen. Eine grobe Faustregel: Je weniger und je näher die Farbtöne, desto leichter entsteht Harmonie. Monochrome und analoge Schemata kümmern sich fast von selbst um sich. Komplementäre, triadische und tetradische Schemata bringen mehr Energie, verlangen aber mehr Disziplin in den nächsten drei Bereichen. ## Harmonie ist auch Helligkeit und Sättigung Sieh dir den triadischen Streifen oben an. Die Farbtöne sind wie aus dem Lehrbuch, aber bei gleicher Stärke wirken sie wie eine Spielzeugkiste. Das liegt daran, dass der Farbkreis nur den Farbton beschreibt. Zwei weitere Eigenschaften entscheiden, ob Farben wirklich gut zusammenpassen. - **Helligkeit:** Eine harmonische Gruppe reicht meist von hellen über mittlere bis zu dunklen Werten. Fünf Farben gleicher Helligkeit verschwimmen ineinander; eine Spanne gibt dem Auge einen Ruhepunkt und etwas zu lesen. - **Sättigung:** Halte die meisten Farben ruhig und lass eine kräftig. Stehen alle Farben auf voller Stärke, konkurrieren sie, und das Schema wirkt wie Rauschen. - **Gemeinsamer Unterton:** Farben, die alle leicht warm sind oder alle eine Spur desselben Farbtons tragen, wirken verwandt, selbst wenn sie im Farbkreis weit auseinanderliegen. Etwas von deiner Hauptfarbe in die Neutraltöne zu mischen ist der schnellste Weg dahin. - Petrolweiß #edf3f2: #edf3f2 - Helles Petrol #88ddd6: #88ddd6 - Petrol #30a69c: #30a69c - Petroltinte #122b29: #122b29 - Korallakzent #e0525d: #e0525d Ein gezähmtes Komplementärschema: Das Petrol führt in vier Helligkeitsstufen, die Neutraltöne tragen eine Spur Petrol, und das rote Gegenüber wird zu einem einzigen Korallakzent. Um diese Anpassungen in Zahlen vorzunehmen, nutze ein Format, das Helligkeit vom Farbton trennt. HSL ist die vertraute Wahl; [OKLCH](https://gradiently.design/de/guide/oklch-explained) hält die Helligkeit besser konstant, wenn du den Farbton änderst, und macht ausgewogene Schemata dadurch viel leichter. ## Proportion: Lass eine Farbe führen Der größte Unterschied zwischen einem harmonischen und einem chaotischen Design liegt meist in der Proportion, nicht im Farbton. Gleiche Anteile von zwei oder drei Farben lassen das Auge zwischen ihnen hin- und herspringen. Eine dominante Farbe, eine unterstützende und ein kleiner Akzent geben ihm eine Hierarchie. Die [60-30-10-Regel](https://gradiently.design/de/guide/60-30-10-rule) ist eine nützliche Startaufteilung. ### Beißt sich - Gleiche Flächen für jede Farbe - Jede Farbe in voller Sättigung - Alle Farben gleich hell - Reingraue Neutraltöne neben warmen Farben - Gegenüber, die sich an langen Kanten berühren ### Harmoniert - Eine Farbe klar dominant - Ein kräftiger Akzent, der Rest ruhiger - Eine Spanne von hell bis dunkel - Neutraltöne mit dem Hauptfarbton getönt - Gegenüber durch Raum oder Neutralton getrennt Ein Instagram-Post im Hochformat, der ein offenes Keramikatelier am Samstag ankündigt, auf einem Verlaufshintergrund Ein Mark: Achte darauf, welche Farbe führt, wie viel vom Bild sie einnimmt und wo die Worte ruhen. Derselbe Atelier-Post auf einem zweiten Verlaufshintergrund mit einer anderen Farbfamilie Ein zweiter Mark mit denselben Worten. Die Farbbeziehung ändert die Stimmung; die Botschaft bleibt gleich. ## So baust du in der Praxis eine harmonische Palette 1. **Starte mit einer Farbe, die etwas bedeutet** Eine Markenfarbe, ein Produkt, ein Ort. Harmonie entsteht leichter um einen festen Punkt als aus dem Nichts. 2. **Wähle eine Beziehung für die Stimmung** Analog für Ruhe, komplementär oder geteilt komplementär für Energie, monochrom für Zurückhaltung. 3. **Helligkeit spreizen, Sättigung beruhigen** Erstelle eine helle, eine mittlere und eine dunkle Version und senke dann die Sättigung von allem außer dem Akzent. 4. **Leg die Proportionen fest** Bestimme, welche Farbe den größten Teil der Fläche bedeckt, welche unterstützt und welche nur in kleinen Akzenten erscheint. 5. **Teste mit echten Worten** Leg die Palette auf ein echtes Layout und prüfe den Textkontrast. Harmonie, die keine Überschrift tragen kann, ist nicht fertig. Wenn du lieber mit einer bereits ausbalancierten Palette startest: Jeder Gradiently Mark ist ein fertiger lebendiger Hintergrund, dessen Farben, Materialien und Licht gemeinsam komponiert wurden, und das Studio legt deine Worte darauf, wobei die automatische Schriftfarbe pro Zeile helle oder dunkle Schrift wählt. Wie du deine eigene von Grund auf erzeugst, steht bei [Farbpaletten-Generatoren](https://gradiently.design/de/guide/color-palette-generator). ## FAQ ### Was ist Farbharmonie? Die Eigenschaft von Farben, die aussehen, als gehörten sie zusammen, meist erreicht durch Farbtonbeziehungen im Farbkreis, kombiniert mit ausgewogener Helligkeit, Sättigung und Proportion. ### Welche Arten von Farbharmonie gibt es? Die klassischen sechs sind monochrom, analog, komplementär, geteilt komplementär, triadisch und tetradisch. ### Welche Farbharmonie ist am einfachsten? Monochrome und analoge Schemata, weil ihre Farbtöne nah beieinanderliegen und sich selten beißen. Sie brauchen eine gute Spanne der Helligkeit, damit sie nicht flach wirken. ### Warum beißen sich meine Komplementärfarben? Meist stehen beide auf voller Sättigung und in gleichen Anteilen. Lass eine dominieren, beruhige die andere zu einem Akzent und trenne sie mit einem Neutralton.