Farbtheorie für Designer (2026 Leitfaden & Spickzettel)

# Farbtheorie: Ein praktischer Leitfaden für Designer und Entwickler

Farbtheorie ist der Rahmen, den Designer verwenden, um Farben zu mischen, zu paaren und anzuwenden, sodass sie gut aussehen und sich richtig anfühlen. Sie verbindet drei Dinge: wie der Farbkreis Farbtöne gruppiert, wie das Gehirn Farbe als Emotion liest und wie Kontrast Text lesbar hält. Wenn du diese drei beherrschst, wird jede Farbpalette einfacher zu bauen.

Dieser Leitfaden ist die Kurzversion von allem, was du brauchst. Wir behandeln den Kreis, jedes gängige Farbschema, die drei Eigenschaften jeder Farbe, was jede Farbe bedeutet und wie du Farbpaletten für echte Marken und Websites veröffentlichst. Jeder Abschnitt verlinkt auf einen tieferen Leitfaden, wenn du weiter gehen willst.

Warum Farbtheorie 2026 immer noch wichtig ist

Designtools werden immer schlauer, aber Farbentscheidungen kommen immer noch auf dich an. Ein Logo, eine Landing Page, ein Diagramm, ein Slide — jedes visuelle Asset beginnt mit einer Farbpalette. Wähle die falsche, und das Design wirkt schief, auch wenn du nicht sagen kannst, warum.

Drei Kräfte machen Farbtheorie 2026 nützlicher, nicht weniger:

• Markensysteme sind größer. Die meisten Marken liefern jetzt Dutzende von Touchpoints — Web, App, Anzeigen, E-Mail, Social, Video. Eine klare Farbpalette hält sie zusammen.
• Marketing ist Multi-Channel. Eine Buttonfarbe, die auf Instagram knallt, kann auf einem Abrechnungsdashboard verpuffen. Farbtheorie sagt dir warum.
• Barrierefreiheit ist eine harte Regel. WCAG-Kontrastregeln sind in immer mehr Designreviews und Klagen verankert. Farben blind zu wählen ist ein echtes Risiko.

Die gute Nachricht: Die Regeln sind einfach, und eine Handvoll kostenloser Tools übernimmt die Mathematik für dich.

Der Farbkreis: primär, sekundär, tertiär

Der Farbkreis ist die Kernkarte der Farbtheorie. Jede Harmonie, jede Farbpalette, jeder Konflikt, den du je gesehen hast, geht zurück auf die Position der Farben auf diesem Kreis.

Es gibt drei Familien:

• Primärfarben — Rot, Gelb, Blau (im traditionellen Künstlerkreis). Du kannst diese nicht aus anderen Farben mischen. Alles andere beginnt hier.
• Sekundärfarben — Orange, Grün, Lila. Erstellt durch Mischen zweier Primärfarben.
• Tertiärfarben — sechs dazwischenliegende Farbtöne wie Rot-Orange, Gelb-Grün oder Blau-Lila. Erstellt durch Mischen einer Primärfarbe mit einer benachbarten Sekundärfarbe.

Designer verwenden auch ein paar andere Kreismodelle, je nach Medium:

Für digitale Arbeit sind RGB und HSL das, was du tatsächlich in CSS eingibst. Der Künstlerkreis regiert immer noch beim Auswählen von Harmonien, weil die Beziehungen zwischen Farbtönen leichter zu sehen sind. Wenn du neu bei Farbcodes bist, deckt unser Hex-Farbcodes-Leitfaden Hex-, RGB- und HSL-Notation im Detail ab.

Eine kurze Anmerkung zu RGB vs. RYB: Die RGB-Primärfarben auf einem Bildschirm (Rot, Grün, Blau) unterscheiden sich von den Künstler-Primärfarben (Rot, Gelb, Blau), weil Bildschirme Licht hinzufügen, während Farbe Licht blockiert. Deshalb gibt das Mischen von rotem und grünem Licht Gelb auf einem Monitor, aber das Mischen von roter und grüner Farbe gibt Matsch. Für die tägliche digitale Designarbeit kannst du Farbpaletten auf dem Künstlerkreis bauen und ohne wesentlichen Verlust nach Hex übersetzen — die Mathematik klärt sich selbst.

Farbschemata (Farbharmonien)

Ein Farbschema — manchmal Farbharmonie genannt — ist ein Satz von Farben, die zusammenarbeiten, weil sie an bestimmten Stellen auf dem Kreis sitzen. Sechs Schemata machen den Großteil der Arbeit im echten Design.

Komplementär

Zwei Farben direkt gegenüber auf dem Kreis — wie Blau und Orange oder Rot und Grün. Der Kontrast ist hoch, die Energie ist hoch, und eine Farbe lässt die andere herausstechen. Großartig für Calls-to-Action und Sportmarken. Verwende eine Farbe für den Großteil des Designs und die zweite als Akzent, sonst ermüdet das Auge schnell.

Für den tiefen Einblick — einschließlich 10 ausgearbeiteter Beispiele und CSS-Variablen — siehe unseren Komplementärfarben-Leitfaden.

Analog

Drei Farben, die nebeneinander auf dem Kreis sitzen — zum Beispiel Blau, Blau-Grün und Grün. Analoge Paletten wirken ruhig und natürlich, weil das Gehirn sie als eine Stimmung liest. Verwende eine als dominante Farbe und die anderen zwei als unterstützende Töne. Denk an Landschaftsfotografie, sanfte Verläufe oder Wellness-Marken.

Lies mehr in unserem Leitfaden zu analogen Farben.

Triadisch

Drei Farben gleichmäßig um den Kreis verteilt — Rot, Gelb und Blau, oder Orange, Grün und Lila. Triadische Paletten wirken verspielt und kühn ohne den Brute-Force-Kontrast von Komplementär. Der Trick ist, eine als Anführer zu wählen und die anderen zwei Unterstützung spielen zu lassen. Cartoons, Kindermarken und Mondrian-artiges Design lieben Triadisch. Burger King, Lego und Toy Story-Plakate lehnen sich alle an triadische Harmonie — hell, ausgewogen und unmöglich, im Regal zu übersehen.

Tetradisch (Quadrat oder Rechteck)

Vier Farben angeordnet als Quadrat oder Rechteck auf dem Kreis — zwei Komplementärpaare gleichzeitig. Mächtig und dynamisch, aber schwerer auszubalancieren. Wähle eine dominante Farbe und behandle die anderen drei als unterstützende Rollen. Funktioniert gut für Editorial-Design und Dashboards mit mehreren Datenkategorien. Wenn du je ein Diagramm mit vier Datenreihen gesehen hast und gedacht hast „diese Farben kämpfen miteinander", war das eine tetradische Palette ohne klaren Helden.

Split-Komplementär

Eine mildere Version von Komplementär. Wähle eine Basisfarbe, dann verwende die zwei Farben auf beiden Seiten ihres Komplements anstelle des Komplements selbst. Du behältst den meisten Kontrast, verlierst aber die Härte. Viele Markensysteme lehnen sich auf dieses Schema, weil es auffällig wirkt, ohne zu schreien. Es ist auch nachgiebig — wenn dein Akzent zu laut wirkt, schiebe ihn eine Stufe weiter, und das Design entspannt sich.

Monochromatisch

Ein Farbton, viele Schattierungen, Tönungen und Töne. Nimm ein einzelnes Blau, füge dann Weiß für Tönungen und Schwarz für Schattierungen hinzu und variiere die Sättigung. Monochromatische Paletten wirken poliert und minimal, weshalb Luxusmarken und SaaS-Dashboards sich darauf lehnen. Der Nachteil: Das Design kann ohne Akzent flach wirken.

Für die vollständige Schritt-für-Schritt-Anleitung zum Bauen monochromatischer Paletten siehe unseren Leitfaden zu monochromatischen Farbpaletten.

Wenn du die Theorie überspringen und eine fertige Palette schnappen willst, hat unser Listenartikel zu Farbpalettenideen über 60 Paletten, die du heute übernehmen kannst.

Die drei Eigenschaften jeder Farbe

Jede Farbe hat drei Stellschrauben, die du drehen kannst. Sobald du sie benennen kannst, wird die Farbauswahl deutlich weniger mysteriös.

Farbton

Die reine Farbe selbst — Rot, Blau, Grün. Farbton ist das H in HSL und HSB. Es ist das, was die meisten Leute meinen, wenn sie „Farbe" sagen. Auf dem Kreis ist Farbton der Winkel (0° Rot, 120° Grün, 240° Blau).

Sättigung (Chroma)

Wie rein oder gedämpft eine Farbe ist. Ein vollständig gesättigtes Rot ist Feuerwehr-Rot. Senke die Sättigung und du erhältst staubige, ausgewaschene Töne. Stelle sie auf null und du landest auf Grau. Sättigung ist das S in HSL und HSB.

Designer verwenden Sättigung, um den Ton zu setzen:

• Hohe Sättigung — kühn, energiegeladen, auffallend. Wird für Buttons und Alarme verwendet.
• Niedrige Sättigung — ruhig, anspruchsvoll, augenschonend. Wird für Hintergründe und Fließtext verwendet.

Helligkeit / Wert (lightness)

Wie hell oder dunkel eine Farbe ist. Das L in HSL steht für lightness; das B in HSB steht für brightness. Beide bewegen sich von Schwarz unten zu Weiß oben, mit dem reinen Farbton irgendwo in der Mitte.

Ein paar verwandte Begriffe, die du hören wirst:

• Tönung — ein Farbton gemischt mit Weiß. Pastelle sind Tönungen.
• Schattierung — ein Farbton gemischt mit Schwarz. Tiefe, stimmungsvolle Farben sind Schattierungen.
• Ton — ein Farbton gemischt mit Grau. Anspruchsvolle, geerdete Farben sind Töne.

Farbtemperatur

Eine weitere Eigenschaft, die zu kennen lohnt. Warme Farben — Rot, Orange, Gelb — wirken nah, aktiv und aufregend. Kühle Farben — Blau, Grün, Lila — wirken fern, ruhig und vertrauenswürdig. Die meisten ausgewogenen Farbpaletten mischen eine warme und eine kühle Farbe, sodass das Design Spannung ohne Chaos hat.

Temperatur verändert auch, wie ein Design „sich liest" auf einen Blick. Warm-lastige Farbpaletten wirken wie Restaurants, Verkäufe und Energy-Drinks. Kühl-lastige Paletten wirken wie Banking-Apps, Krankenhäuser und Meditationstools. Zu wissen, auf welche Seite des Kreises du dich lehnst, ist die halbe Schlacht beim Abgleichen von Farbe mit Marke.

Farbpsychologie und Bedeutung

Farben tragen Bedeutung. Ein Teil davon ist hartverdrahtet (Rot = Blut = Gefahr), und ein Teil davon ist kulturell (Weiß = Hochzeiten im Westen, Beerdigungen in Teilen Asiens). So oder so, dein Publikum liest Farbe, bevor es Worte liest.

Hier sind die groben westlichen Assoziationen, mit denen die meisten Designer arbeiten:

• Rot — Dringlichkeit, Leidenschaft, Appetit, Gefahr. Verwendet für Verkäufe, Essen, Sport.
• Orange — freundlich, energiegeladen, erschwinglich. Verwendet für Fitness, Kindermarken, Deals.
• Gelb — optimistisch, sonnig, aufmerksamkeitsstark. Verwendet für Warnungen und fröhliche Marken.
• Grün — Wachstum, Geld, Natur, Gesundheit. Verwendet für Finanzen, Wellness, Öko-Marken.
• Blau — Vertrauen, Ruhe, professionell. Verwendet für Banken, Software, Gesundheitswesen.
• Lila — Luxus, Kreativität, Königlichkeit. Verwendet für Beauty, Premium, Fantasy.
• Pink — verspielt, romantisch, modern. Verwendet für Beauty, Dating, Mode.
• Braun — erdig, robust, zuverlässig. Verwendet für Outdoor, Essen, Handwerk.
• Schwarz — anspruchsvoll, kraftvoll, premium. Verwendet für Luxus, Tech, Mode.
• Weiß — sauber, einfach, modern. Verwendet für SaaS, Gesundheitswesen, Minimalismus.

Zwei Vorbehalte, die das nützlich halten, nicht spielerisch:

1. Kontext schlägt Liste. Rot auf einem Checkout-Button signalisiert „kaufen"; Rot auf einem Fehler-Toast signalisiert „stop". Gleicher Farbton, andere Bedeutung. Die umgebende Form, der Text und die Bewegung ziehen die Bedeutung in die eine oder andere Richtung.
2. Kultur prägt Bedeutung. Wenn du global ausspielst, lass deine Palette von jemandem in jedem wichtigen Markt vor dem Launch prüfen. Weiß bedeutet Reinheit im Westen und Trauer in Teilen Ostasiens. Rot bedeutet Glück in China und Gefahr auf einem US-Dashboard. Branche zählt auch — Grün bedeutet „Wachstum" in der Finanzbranche, aber „los" auf einer Verkehrsampel und „natürlich" auf einer Lebensmittelverpackung.

Die Erkenntnis: Behandle Farbpsychologie als Ausgangshypothese, nicht als Regel. Teste die Palette im Kontext, mit echtem Text, auf echten Bildschirmen, bevor du dich festlegst.

Gesponsert von den Machern

Genug von langweiligen Screenshots? Probier ScreenSnap Pro.

Wunderschöne Hintergründe, professionelle Annotationen, GIF-Aufnahme und sofortiges Cloud-Sharing — alles in einer App. Einmalig 29 $, für immer deins.

Sieh, was es kann

Farbe in der Praxis

Theorie ist schön. Der echte Test ist, ob du eine Palette an eine Marke, eine Website und ein zugängliches UI ausliefern kannst, ohne sie zu brechen.

Markenidentität

Eine Marken-Farbpalette ist mehr als eine Logofarbe. Die meisten Marken liefern fünf Rollen:

• Primär — die Heldenfarbe (denk an Spotify-Grün, Slack-Lila).
• Sekundär — eine unterstützende Farbe, oft ein Komplement oder analoger Nachbar.
• Akzent — die laute, verwendet für Buttons und Highlights.
• Neutrale — Grautöne, Off-Whites und dunkle Oberflächen für Hintergründe und Text.
• Funktional — Grün für Erfolg, Rot für Fehler, Gelb für Warnung, Blau für Info.

Der größte Fehler ist, eine Logofarbe auszuliefern und dort aufzuhören. Echte Markensysteme definieren jede Rolle oben, plus Tönungen und Schattierungen für jede. Unser Leitfaden zur Markenfarbpalette geht jede Rolle mit Hex-Werten von echten Unternehmen durch.

Webdesign

Eine Website-Palette ist eine Markenpalette mit zusätzlichen Regeln. Du brauchst:

• Eine Hintergrundfarbe, die augenschonend ist.
• Eine Textfarbe mit genug Kontrast zum Lesen.
• Eine primäre Aktionsfarbe, die hervorsticht, ohne zu schreien.
• Hover- und Aktiv-Zustände für jedes interaktive Element.
• Eine Farbe für Links, Fehler und deaktivierte Zustände.

Die meisten Designer beginnen mit den Markenfarben und bauen den Rest dann mit dem Material-Design-Farbsystem oder einem ähnlichen Token-Framework. Für vollständige Website-Paletten mit Code siehe unseren Leitfaden zu Website-Farbpaletten.

Barrierefreiheit (WCAG-Kontrast)

Farbe ist nicht nur Dekoration — für Menschen mit Sehschwäche oder Farbenblindheit ist sie der Unterschied zwischen Nutzung deines Produkts und Abprallen. Der WCAG-2.1-Standard des W3C setzt die minimalen Kontrastverhältnisse:

Hellgrau auf Weiß mag elegant aussehen, aber wenn es unter 4,5:1 fällt, lässt du Leser zurück. Prüfe die Verhältnisse immer vor der Veröffentlichung. Für die vollständige Aufschlüsselung siehe unseren Leitfaden zu Farbkontrast und WCAG.

Über Kontrast hinaus gehen drei weitere Barrierefreiheits-Gewohnheiten weit:

• Verwende niemals Farbe allein, um Bedeutung zu tragen. Paare Farbe mit einem Icon, einem Label oder einer Form. Ein roter Fehlerrahmen ohne Fehlernachricht scheitert für Nutzer mit Rot-Grün-Farbenblindheit.
• Teste mit einem Farbenblindheits-Simulator. Etwa 8 % der Männer und 0,5 % der Frauen haben irgendeine Form von Farbsehschwäche. Lass jede Farbpalette vor der Veröffentlichung durch einen Sim laufen.
• Achte auf Dark Mode. Eine Palette, die WCAG auf Weiß besteht, kann auf einem dunklen Hintergrund scheitern. Teste beide Themes gegen denselben Inhalt.

Tools, die dir Farbtheorie abnehmen

Du musst die Mathematik nicht von Hand machen. Eine Handvoll kostenloser Tools deckt jeden Teil des Workflows ab.

• Zum Bauen von Harmonien aus einer einzelnen Basisfarbe verwende unseren Farbpaletten-Generator. Wähle einen Hex, wähle ein Schema, kopiere die Ausgabe.
• Zum Heben einer Palette aus einem Foto oder Screenshot verwende den Farbpaletten-Extraktor. Ziehe ein Referenzbild hinein und greife die dominanten Farben.
• Zum Greifen einer einzelnen Farbe aus einem beliebigen Bild verwende den Farbwähler. Pipette trifft Hex-Kopie.
• Zum Verifizieren von WCAG-Kontrast bei Text-und-Hintergrund-Paaren verwende den Farbkontrast-Prüfer. Füge zwei Farben ein, erhalte das Verhältnis.
• Zum Prüfen, wie deine Palette mit Farbenblindheit liest, verwende den Farbenblindheits-Simulator. Probiere jeden gängigen Typ von Farbsehschwäche.
• Zum Mischen zweier Farben in einen sanften Verlauf verwende den Verlaufsgenerator. Stelle Stopps ein, kopiere das CSS.
• Zum Konvertieren eines Hex-Codes in RGB für CSS oder Designtokens verwende Hex zu RGB.
• Für den anderen Weg — RGB zu Hex — verwende RGB zu Hex.

Diese Tools decken das meiste ab, was Designer früher mit dem Auge gemacht haben. Zum Inspirations-Stöbern sind auch Adobe Color und Coolors ein Lesezeichen wert.

Ein einfacher Workflow zum Auswählen einer Palette

Wenn du auf eine leere Leinwand starrst, hier ist die Reihenfolge, die die meisten Designer befolgen.

1. Wähle deine eine Anker-Farbe. Das ist die Farbe, um die die Marke oder das Produkt gebaut ist. Oft ist es eine Logofarbe oder ein Gefühlswort („ruhiges Blau").
2. Wähle ein Schema. Brauchst du Kontrast? Komplementär oder Split-Komplementär. Brauchst du Ruhe? Analog oder monochromatisch. Brauchst du Verspieltheit? Triadisch.
3. Generiere die Palette. Stecke deinen Anker in den Farbpaletten-Generator und wähle das Schema.
4. Füge Neutrale hinzu. Fast jede Palette braucht ein Fast-Weiß, ein Fast-Schwarz und zwei oder drei Grautöne dazwischen.
5. Teste auf Kontrast. Paare deine Text- und Hintergrundfarben im Farbkontrast-Prüfer und ziele auf mindestens 4,5:1.
6. Teste auf Farbenblindheit. Lass die Palette durch den Farbenblindheits-Simulator laufen und stelle sicher, dass funktionale Farben (Erfolg / Fehler) immer noch unterscheidbar sind.
7. Veröffentlichen und Dokumentieren. Speichere Hex-Werte für jede Farbe und jede Rolle. Zukünftiges Du wird gegenwärtigem Du dafür danken.

Du kannst diesen Workflow in 15 Minuten wiederholen, sobald du es ein paar Mal gemacht hast.

Häufige Farbfehler (und schnelle Korrekturen)

Selbst erfahrene Designer stolpern über die gleiche Handvoll Farbprobleme. Hier sind die, die Woche für Woche im Designreview auftauchen, plus die Korrektur für jedes.

Zu viele Farben

Eine Palette mit acht gleichgewichtigen Farben sieht aus wie ein Zirkus. Reduziere auf eine dominante, zwei unterstützende und eine oder zwei Akzente. Verwende die 60-30-10-Regel als Leitfaden. Funktionale Farben (Erfolg, Fehler, Warnung) zählen nicht zu deiner Hauptpalette — sie sind Rollenfarben, die obendrauf sitzen.

Reines Schwarz und reines Weiß

Reines #000000 auf reinem #FFFFFF ist technisch der höchste Kontrast, den du bekommen kannst, fühlt sich aber auf Bildschirmen hart an. Die meisten Produktionspaletten verschieben sich leicht — #1A1A1A für „Schwarz"-Text und #FAFAFA für „Weiß"-Hintergründe. Das Auge entspannt sich, der Kontrast besteht immer noch WCAG, und das Design wirkt modern statt klinisch.

Sättigung auf Maximum

Eine Wand aus vollständig gesättigten Farben kämpft um Aufmerksamkeit und ermüdet das Auge. Senke die Sättigung um 10–20 % bei unterstützenden Farben und reserviere volle Sättigung für das eine Element, das der Nutzer tatsächlich bemerken soll — meist der primäre Call-to-Action.

Farbenblindheit ignorieren

Rot und Grün tragen Bedeutung („ja" und „nein", „gut" und „schlecht"), sind aber auch die häufigsten Formen von Farbenblindheit. Wenn dein Dashboard nur Rot und Grün verwendet, um Status zu kennzeichnen, kann etwa 1 von 12 Männern sie nicht unterscheiden. Füge ein Icon, ein Label oder eine Form hinzu, damit die Bedeutung ohne die Farbe überlebt.

Die Dokumentation überspringen

Du hast eine großartige Palette gewählt. Zwei Monate später kannst du dich nicht erinnern, ob das sekundäre Grün #22C55E oder #16A34A ist. Speichere jeden Hex-Wert mit seiner Rolle daneben — primär, Akzent, neutral-100, Erfolg, Fehler — und lege die Datei mit dem Designsystem ab. Zukünftiges Du wird gegenwärtigem Du dafür danken.

Häufig gestellte Fragen

Was ist die wichtigste Regel der Farbtheorie?

Die 60-30-10-Regel. Verwende eine Farbe für 60 % des Designs (meist ein Neutral oder Hintergrund), eine zweite für 30 % (eine unterstützende Farbe) und eine dritte für 10 % (den Akzent). Das hält jede Palette ausgewogen, selbst wenn du bei jeder anderen Regel mogelst.

Hex vs. RGB vs. HSL — welches sollte ich verwenden?

Hex-Codes (#3B82F6) sind kurz und leicht zu kopieren, weshalb sie die Designtool-Ausgabe dominieren. RGB (rgb(59, 130, 246)) ist derselbe Wert in einem anderen Format und ist leichter in CSS-Variablen zu lesen. HSL (hsl(217, 91%, 60%)) ist besser für Code, weil du Helligkeit oder Sättigung ändern kannst, ohne eine neue Farbe zu wählen. Die meisten Profis verwenden Hex für die Speicherung und HSL für das Anpassen. Unser Hex-Farbcodes-Leitfaden deckt jedes Format im Detail ab.

Wie prüfe ich Farbkontrast für Barrierefreiheit?

Füge deine Textfarbe und Hintergrundfarbe in einen Kontrast-Prüfer ein. Ziele auf mindestens 4,5:1 für normalen Text und 3:1 für großen Text — das WCAG-AA-Minimum. Der schnellste Weg ist unser Farbkontrast-Prüfer, der dir das Verhältnis plus ein Bestanden-/Nicht-bestanden-Abzeichen gibt. Die offizielle WCAG-Dokumentation des W3C erklärt die Regeln im Detail.

Was sind Komplementärfarben?

Komplementärfarben sitzen direkt gegenüber auf dem Farbkreis — Blau und Orange, Rot und Grün, Gelb und Lila. Sie zu paaren, ergibt den stärksten möglichen Kontrast, weshalb Komplementärschemata so häufig auf Call-to-Action-Buttons sind. Für einen tieferen Blick darauf, wie man sie verwendet, ohne dass das Design laut wirkt, siehe unseren Komplementärfarben-Leitfaden.

Was ist der Unterschied zwischen Farbton, Tönung, Schattierung und Ton?

Farbton ist die reine Farbe (reines Rot). Eine Tönung ist Farbton plus Weiß (Pink). Eine Schattierung ist Farbton plus Schwarz (Kastanienbraun). Ein Ton ist Farbton plus Grau (staubiges Rosa). Designer verwenden alle drei, um einen einzelnen Farbton zu einer vollständigen Palette zu erweitern, ohne neue Farben zu wählen. Das ist die Grundlage monochromatischer Schemata — lies mehr in unserem Leitfaden zur monochromatischen Palette.

Was ist die 60-30-10-Regel im Farbdesign?

Ein einfaches Verhältnis für ausgewogene Farbnutzung: 60 % dominante Farbe, 30 % sekundär, 10 % Akzent. Die dominante ist meist ein Neutral oder Hintergrund. Die sekundäre unterstützt sie. Der Akzent ist das, worauf das Auge landet — der Button, die Überschrift, der Call-to-Action. Es funktioniert für Innenräume, Plakate, Websites und Slides.

Wie wähle ich eine Farbpalette für meine Marke?

Beginne mit einer Anker-Farbe, die mit der Stimmung deiner Marke verbunden ist. Füge einen komplementären oder analogen Nachbarn als sekundär hinzu. Füge einen lauten Akzent für Buttons hinzu. Füge Neutrale für Hintergründe und Fließtext hinzu. Füge funktionale Farben für Erfolgs-, Fehler- und Warnungs-Zustände hinzu. Das ist eine Fünf-Rollen-Markenpalette — siehe unseren Leitfaden zur Markenfarbpalette für Hex-Beispiele von echten Unternehmen.

Wo kann ich mehr über Farbtheorie lernen?

Der Wikipedia-Artikel zur Farbtheorie deckt die akademische Geschichte und Physik ab. Adobe und die Designcommunity haben großartige angewandte Inhalte. Unser Cluster aus Farbleitfäden — Schemata, Paletten, Hex-Codes und Barrierefreiheit — ist gebaut, um dich von „Ich weiß nichts" zu „Ich kann eine Palette ausliefern" zu bringen, ohne die Site zu verlassen.

Wenn du den ganzen Tag Produktvisuals, Screenshots oder Marketingassets baust, gibt dir ScreenSnap Pro die Erfassungs- und Annotations-Seite des Workflows — paare es mit den Farbtools oben und du hast eine vollständige Designschleife auf Mac und Windows für einmalige 29 $.