Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites

Letztes Artikel-Update:
24. August, 2020

In den letzten Jahren haben sich einige Farbtrends im Webdesign etabliert. Dieser Beitrag stellt dir die wichtigsten Farbkombinationen vor – als Inspiration für deine Website-Projekte.
4.8
(55)

Eigentlich braucht jeder Orientierung. 
Auch wir Designer beim Gestalten eine Website.

Da kann es hilfreich sein, entsprechende Inspirationen und Vorbilder zu haben, an denen man sich orientieren kann.  Dies heißt nicht, eine dieser Inspirationen 1zu1 zu kopieren. Vielmehr kann man sich davon anregen lassen, eigene Gestaltungen auszutesten.

Das gilt besonders beim Thema Farbe. Denn eines der herausforderndsten Aspekte bei der Gestaltung eines Screendesigns ist die Auswahl des Farbschemas. Denn die Wirkung von Farben trägt entscheidend zur Wirkung der Website bei.

Hilfreich können hier die Webdesign-Trends sein, die in den letzten Jahren gekommen sind, die teilweise auch wieder gegangen sind und manche auch geblieben sind. Denn auch in der Farbgebung gibt es Entwicklungen, die sich durchgesetzt haben. Also Farbkombinationen, die (über Jahre) im Webdesign immer wieder eingesetzt werden.

Wie du konkrete Farbtöne für deine Website findest, habe ich in einem eigenen Artikel beschrieben.
In diesem Beitrag möchte ich dir Farbtrends im Webdesign aufzeigen, die dir hierfür als Anregung dienen können. 

Diese Farbtrends haben sich bewährt, weil sie funktionieren. Die Farbkombinationen, die nicht mehr zeitgemäß erscheinen, habe ich schon weggelassen.

Dark Mode

Quasi jedes Betriebssystem bietet heute einen Dunkelmodus an. Code-Editoren haben dies schon lange. Und nun ist die Entwicklung auch im Webdesign angekommen.

Was ursprünglich gedacht war, um Strom zu sparen und um die Augen zu schonen, hat auch seine ganz eigene Ästhetik. Ein scharzer – oder zumindest ziemlich dunkler Hintergrund – kann eine Mischung zwischen Eleganz, Dominanz und eben „Darkness“ verbreiten. Gleichzeitig strahlen alle anderen Farbtöne auf solch einem dunkleen Hintergrund viel intensiver, als sie es auf einem hellen oder gar weißen Hintergrund jemals könnten. Auch gerade Bilder kommen hier besonders zur Entfaltung. So werden Bildergalerien ja gerne auf dunklem Hintergrund präsentiert, man denke nur an die gute alte Lightbox.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 1
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 2
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 3

Es hat aber auch seine Gründe, warum nur wenige (Corporate) Websites und Shops ihr Webdesign im Dark Modus umgesetzt haben. Die Farbtöne für Texte, Links, Buttons, Navigation usw. müssen entsprechend hell sein, um sich überhaupt gegen den schwarzen Hintergrund zu durchzusetzen und nicht von diesem quasi verschluckt zu werden.

Und auf die Dauer wirkt ein schwarzer Hintergrund eben meistens düster und hemmend, was für klassische Unternehmenswebsites ungünstig ist. Daher hat sich der Dark Modus eher im Bereich der Portfolio-Website bewährt.

Und der Dark Mode muss nicht immer ganz Schwarz sein. Auch ein dunkler Farbton kann eine sehr eigenwillige Atmosphäre erzeugen, die dann zum Beispiel auf für einen Maler Meisterbetrieb sehr passend wirkt:

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 4

Das Standard-Web-Blau

Es ist ja eigentlich mit das Erste, was der Webdesigner macht: Das Standardblau der Textlinks entfernen, bzw. diesem einem andere Farbton zuweisen.

Lange galt dieses Standardblau als unschön und unbrauchbar. Und wenn ich ehrlich bin: Auch ich mochte diesen Farbton sehr lange überhaupt nicht. Was dann geschah? Ich kann es gar nicht genau sagen, aber auf einmal fand sich auf immer mehr Websites dieser kräftige Blauton.

Klar, Blau ist eine Farbe, die auf verdammt vielen Webseiten eingesetzt wird. Blau ist sozusagen die Mutter aller Unternehmensfarben.

Aber dieser so penetrant, dominant leuchtende Farbton, neben dem quasi alle anderen Farben untergehen? Dieser Farbton soll auf einmal in Webdesigns der bestimmende Ton sein?

Vielleicht kommt auf einmal so gut an, gerade weil er sich nicht zurück nimmt, wie es die meisten Blautöne machen. Nein, dieser Blauton will ein Zeichen setzen. Als Standardlinkfarbe sagt er ja, „Hey, hier bin ich. Klick mich!“.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 5
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 6

Als Farbe im Screendesign zeigt er Selbstbewusstsein, will präsent sein. Sich nicht zurück nehmen.

Soviel Blau kann man auch einmal alleine stehen lassen. Hier braucht es keine weiteren Farbtöne oder vielfarbige Bilder als Ergänzung oder Unterstützung.

Natürlich muss der Blauton nicht immer so großflächig eingesetzt werden. Es gibt auch Websites, bei denen er „nur“ als Highlight, eben zum Beispiel als Link- und Buttonfarbe, eingesetzt wird.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 7

Blau-Varianten

Es muss dabei nicht immer der exakte #0000ff-Farbton sein. Auch (leichte) Abstufungen davon zeigen, wie sich ein kräfitges Blau als zeitgemäße Farbe präsentieren kann. Mal großflächig, mal als typografisches Highlight, mal als Duplexton für Bilder.

In der reinen Form ohne weitere Farbtöne, nur mit Schwarz/Grau und vor allem viel Weiß entfaltet dieses Blau anscheinend seine ganze Wirkung.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 8
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 9
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 10

Und wer diese Blautöne in eigenen Screendesigns austesten möchte, der kann neben dem Standard #0000ff noch folgende Varianten ausprobieren:

Verschiedene Blautöne

Pastellfarben

Wer einmal im Baumarkt durch die Farbabteilung gelaufen ist, der weiß: Pastellfarben sind beliebt.

Da wundert es nicht, dass sich die hellen Farbtöne, die sich durch einen hohen Anteil an Weiß auszeichnen, auch Im Webdesign immer häufiger zum Einsatz kommen.

Pastellfarben sind sehr helle Farbtöne, die sich vor allem untereinander gut kombinieren lassen. Eine kleine Suche im Bildernetzwerk Pinterest gibt einen ersten Farbeindruck:

PInterest Pastelltöne

Pastellfarben erzeugen eine helle und freundliche Stimmung. Sie Können aber sicherlich auch fad und langweilig wirken. Anders als die zuvor vorgestellte Blautöne nehmen sie sich eher zurück.

Den Einsatz von Pastellfarben auf Webseiten kann man in zwei Bereiche aufteilen:

Die einen setzen vor allem auf einen einzigen pastellenen Farbton. Dieser wird als Highlightfarbe eingesetzt.

Die anderen setzen auf mehrere pastellene Farbtöne. Da diese eher dezent sind, lassen sich auch gut mehrere von ihnen kombinieren ohne dass das Design zu bunt wirkt.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 11
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 12
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 13
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 14

Schwarz-Weiß

Reduziert minimalistisch – dieser Webdesign-Trend, der sich auf die komplette Gestaltung bezieht, heißt meistens auch:
Maximal zwei Farbtöne.

Und da es eben minimalistisch sein soll, heißen diese beiden Töne meistens Schwarz und Weiß.

Websites, die mit Schwarz auf Weiß arbeiten wirken klar, strukturiert, sachlich. Dazu sind sie sehr prägnand.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 15
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 16
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 17
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 18

Kräftiges Rot

Wir hatten ja schon das kräftige Standardblau. Auch kräftige Rottöne werden gerne eingesetzt.

Rot kann dezent eingesetzt als Highlightfarbe agieren, wie bspw. bei Buttons und Links. Nimmt man Rot nun aber großflächig – dann knallt es…

Rot will Aufmerksamkeit, viel Rot bekommt viel Aufmarksamkeit. Das muss so gewollt sein, ansonsten geht der Schuss nach hinten los. Daher eigent es sich nur für laute, dynamische, starke Marken. Wer viel Rot wählt, bekommt Präsenz.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 19
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 20
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 21
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 22

Für den klassisch-konservativen Mittelständler ist solch ein Rotton weniger geeignet.
Agenturen – oder generell im weitesten Sinne „kreative“ Unternehmen – nehmen kräftiges Rot daher umso lieber.

Grüne Nachhaltigkeit

Das Thema schlechthin. Aus Gründen. Und da auch bei der Farbwahl quasi alles auf Konsum und Wirtschaftlichkeit ausgerichtet ist, wird dieser Trend gerne aufgenommen.

Die Wirtschaft muss endlich grüner, nachhaltiger werden, viele Unternehmen wollen dies nun mit einer grünen Farbwahl bezeugen. Ob die Webseitebetreiber wirklich nachhaltig arbeiten oder es mehr der grüne Anstrich ist – also das sog. Greenwashing – sein mal dahingestellt.

Bei den folgenden Unternehmen können wir uns zumindest sicher sein, dass diese für ein besseres Wirtschaften stehen:

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 23
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 24

Aber auch unabhängig von der Frage der Nachhaltigkeit: Grüne Farbkombinationen wirken natürlich und harmonisch und sind alleine schon daher oft eine gute Wahl.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 25
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 26
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 27

Erdfarben

Erdige Farbtöne wie Ocker, Umbra, Zinnober oder auch Creme-Weiß haben eine entspannte Wirkung.
Dazu sind sie auch naturnah und setzen im Grunde die „grüne Nachhaltigkeit“ fort.

Ähnlich wie bei den Pastellfarben lassen sich sehr harmonische Farbkombinationen gestalten, die eine angenehm-vertraute Atmosphäre schaffen.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 28
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 29
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 30

Zusammen mit dem Naturwirkung erzeugen diese Farben eine heimeliges Gefühl. Sie lassen sich dabei hell-freundlich oder auch konservativ-dunkler einsetzen.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 31
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 32

Neon

Bähm. Knallt rein. Anders als die knalligen Blau- und Rottöne lassen sich Neonfarben nicht großflächig, sondern „nur“ dezent einsetzen. Als Highlight, um die Aufmerksamkeit gezielt zu lenken.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 33
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 34
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 35
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 36

Farbenfroh

Warum nur ein, zwei markante Farbtöne einsetzen, wenn man doch die freie Auswahl hat?

Der Trend zum Minimalismus hat natürlich auch einen Gegentrend hervorgerufen: Es noch farbenfroher zu gestalten. Viele, viele bunte Farben…

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 37
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 38
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 39
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 40
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 41

Verläufe

Naja gut, hier geht es weniger um konkrete Farben, als mehr um das „Zusammenspiel“ verschiedener Farbtöne.
Verläufe waren ja schon einmal zu Zeiten des sog. Web 2.0 schwer angesagt. Dann lange Zeit eher verpönt und fast verschwunden. Und nun sind sie kräftig gund präent zurück. Gerne auch mal farbenfroh leuchtend:

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 42
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 43
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 44
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 45

Entsättigte Farben

Wenn alles knallt, dann gibt es eben auch die Designs, die sich zurücknehmen. Das geht zum Beispiel, in dem die Farbtöne entsättigt werden.

Den reinen, leuchtenden Farbtönen wird dazu Schwarz oder Weiß beigemischt. Die entstehenden entsättigten Farbtöne wirken dann gedämpft, wie hinter einem Grauschleier. Entsättigte Farben wirken unaufdringlich zurückhaltend.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 46
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 47
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 48
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 49
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 50
Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 51

Pantone „Marketing“farben

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 52

Pantone ist ein bekannter Hersteller von Sonderfarben für den Druck. Und seit dem Jahre 2000 küren Sie nun schon die Pantone-Farbe des Jahres.

Das heißt, ein (beliebiger) Farbton wird in sehr geheimen Meetings von sehr wichtigen (Marketing-, PR-, Design-) Menschen diskutiert, erschaffen, ausgewürfelt … ach, ich weiß es doch auch nicht…

Ein Marketing-Gag, klar.

Die Idee einer Farbe des Jahres ist aber nicht blöd – also zumindest Vermarktungstechnisch, inhaltlich hat sie wohl so gar keinen Sinn. Aber muss es ja auch nicht. Den jedes Jahr wird in breiter Front über die Pantone-Farbe des Jahres berichtet, so dass es sich aus Werbesicht eben lohnt.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 53

Einen schnellen Überblick bietet die Seite Visualizing Every Pantone Color of the Year.

Die Webdesign Farbtrends

Das waren die aktuellen Farbtrends im Webdesign. Von großflächig knallig über nachhaltig-naturverbunden bis zu dezent und minimalistisch – also eigentlich für jeden Geschmack etwas dabei.

Du kannst diese Farbtrends als Anregung sehen: Beim nächsten Website-Projekt mal mit einer der vorgestellten Farbtrends zu beginnen. Und sie zu anzupassen. Und sie mit dem Kunden zu verfeinern.

Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites 54

Weitere hilfreiche Artikel zum Thema Farbe:

Welche Farbtrends magst du?
Oder habe ich gar welche vergessen?
Oder hast du schon ganz neue Farbtrends entdeckt?

Lass es uns doch in den Kommentaren wissen:

Bewertungsergebnis: 4.8 / 5. | Anzahl der Bewertungen: 55

Hole dir die Webdesign-CHECKLISTE mit über 90 Checkpunkten für Dein nächstes Projekt & den monatlichen Webdesign-NEWSLETTER:

Schließe dich über 2.600 Newsletter-Abonnenten an

Keine Sorge, Spam gibt es hier nicht, stattdessen regelmäßig Webdesign-Tipps, -Links und -Angebote von mir! Du kannst den Newsletter auch jederzeit problemlos abbestellen. Mehr Infos dazu:
(Beispiele, Datenschutz, Analyse und Widerruf)

Kommentare zum Artikel

1 Kommentar zu „Farbtrends im Webdesign – Das sind die angesagtesten Farbkombinationen auf Websites“

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Über den Autor

Martin Hahn ist Webdesigner, Dozent, Fachbuchautor und dreifacher Papa.
Seit vielen Jahren hilft er anderen effektivere Webdesigns zu erstellen – in Schulungen und mit Artikeln auf dieser Website.

Mehr über diese Website
und den Autor erfahren   →

Ähnliche Artikel

Design- & Webdesign-Blogs & -Podcasts zur Weiterbildung

Eine der größten Herausforderungen für Webdesigner und generell alle im Online-Bereich tätigen ist es, auf dem Laufenden zu bleiben. Hier präsentiere ich dir aktuelle Design- & Webdesign-Blogs und Podcasts, um sich regelmäßig weiterzubilden.

Der Status quo im Webdesign

Webdesign ist tot. Lang lebe Webdesign – Ja was denn nun genau? Wie so oft liegt die Wahrheit dazwischen. Den aktuellen Stand des Webdesigns erklärt dir dieser Artikel.

Entdecke Artikel aus den Bereichen:

Designwissen | Web-Entwicklung | Business-Entwicklung | Inspiration

Scroll to Top