Farbverläufe

Farbverläufe

Was ist ein Farbverlauf? Ein einfacher Leitfaden zu Farbübergängen

5 Min. Lesezeit

Ein Farbverlauf ist die einfachste Idee der Farbe und eine der am leichtesten verpatzten. Hier steht, was er ist, wie er aufgebaut ist und warum er überall auf Bildschirme zurückgekehrt ist.

Farbverläufe

Linear, radial, konisch, Mesh: alle Arten von Farbverläufen erklärt

5 Min. Lesezeit

Jeder Farbverlauf bewegt Farbe entlang eines Pfads. Ändere den Pfad, und du änderst das Gefühl. Hier ist jede Art, wie sie aussieht, der Code dafür und die Aufgabe, die sie am besten erledigt.

Farbverläufe

Mesh Gradient: was ein Mesh-Verlauf ist und wie du einen erstellst

5 Min. Lesezeit

Mesh-Verläufe sind die weichen, treibenden Farbfelder hinter der Hälfte aller Launch-Seiten, die du dieses Jahr gesehen hast. So funktionieren sie, so baust du einen von Hand, und das sind die zwei Fehler, die die meisten ruinieren.

Farbverläufe

Farbverlauf-Hintergrund machen, der nicht nach Standard aussieht

5 Min. Lesezeit

Die meisten Farbverlauf-Hintergründe sehen gleich aus, weil sie von denselben wenigen Vorlagen ausgehen. Hier ist eine Methode in fünf Schritten für einen, der durchdacht wirkt, mit Codes zum Kopieren.

Farbverläufe

Farbverlauf mit Körnung: warum etwas Rauschen Farbe edel wirken lässt

5 Min. Lesezeit

Ein glatter Farbverlauf sieht aus wie eine Bildschirmvorgabe. Derselbe Verlauf mit einer feinen Schicht Körnung sieht aus wie ein Druck, ein Filmstill oder eine gestrichene Wand. Hier steht, warum, wie viel und wie.

Farbverläufe

Aurora-Farbverläufe: weiches Licht, richtig gemacht

5 Min. Lesezeit

Aurora-Farbverläufe borgen sich den Look des Nordlichts: leuchtende Farbschleier, die über der Dunkelheit treiben. Sie sind wunderschön und kippen schnell in Bildschirmschoner-Gebiet. So bleibst du auf der richtigen Seite.

Farbverläufe

Warum dein Farbverlauf Streifen hat und wie du Banding behebst

5 Min. Lesezeit

Du hast einen sanften Farbverlauf gemacht, und er kam gestreift zurück. Das ist Banding, es hat eine einfache Ursache und eine Handvoll verlässlicher Lösungen. Hier ist zuerst die Rechnung, dann die Heilmittel.

Farbverläufe

Warum manche Farbverläufe in der Mitte grau werden und was hilft

5 Min. Lesezeit

Blau und Gelb sollten einen schönen Verlauf ergeben. Mischst du sie auf die Standardweise, bekommst du einen grauen Fleck in der Mitte. Hier steht genau, warum, und vier Wege, jeden Übergang sauber zu halten.

Farbverläufe

60 Farbverlauf-Kombinationen, die funktionieren, mit Codes

5 Min. Lesezeit

Sechzig Farbverläufe, sortiert nach dem Gefühl, das du willst, nicht nach Farbton. Jeder ist ein lebendiger CSS-Code zum Kopieren, und jede Gruppe erklärt die Regel, die ihre Mischungen funktionieren lässt.

Farbverläufe

Zweifarbige Farbverläufe: 30 Farbpaare, die immer passen

5 Min. Lesezeit

Zwei Farben, eine Richtung, nichts kann schiefgehen. Fast. Hier sind die zwei Regeln, die entscheiden, ob ein Paar funktioniert, und dreißig Paare, die beide erfüllen, fertig zum Kopieren.

Farbverläufe

Dunkle Farbverlauf-Hintergründe: Tiefe statt Düsternis

5 Min. Lesezeit

Dunkle Farbverläufe können wie eine edle Nachtszene aussehen oder wie ein trüber Bildschirm mit heruntergedrehter Helligkeit. Den Unterschied machen ein paar Entscheidungen, die sich alle leicht übernehmen lassen.

Farbverläufe

Pastell-Farbverläufe, die frisch bleiben statt zuckersüß

4 Min. Lesezeit

Pastelltöne sind die Verläufe, die man am leichtesten mag, und die, die man am leichtesten übertreibt. Ein paar Regeln sorgen dafür, dass sie wie Frühlingslicht auf Papier wirken statt wie eine Geburtstagstorte.

Farbverläufe

Neon-Farbverläufe: Leuchten, ohne die Augen zu ermüden

5 Min. Lesezeit

Neon ist Farbe auf voller Stufe. Auf dunklem Grund leuchtet sie; über einen ganzen Bildschirm verteilt, surrt sie. So behältst du das Leuchten und verlierst das Surren.

Farbverläufe

Holografische Farbverläufe und Irisieren, einfach erklärt

5 Min. Lesezeit

Holografische Folie, Seifenblasen und Perlmutt ändern ihre Farbe, wenn du dich bewegst. Ein flacher Bildschirm kann das nicht, aber ein gut gebauter Farbverlauf kann das Auge davon überzeugen.

Farbverläufe

Der Duotone-Effekt: jedes Foto in zwei Farben markengerecht

5 Min. Lesezeit

Duotone macht aus jedem Foto zwei Farben deiner Wahl: eine für die Schatten, eine für das Licht. Es ist der schnellste Weg, damit unpassende Bilder wie eine Marke wirken.

Farbverläufe

Farbverlauf oder Vollfarbe? Wann welche Lösung gewinnt

5 Min. Lesezeit

Vollfarbe ist klar, günstig und exakt. Farbverläufe sind lebendig, unverwechselbar und schwerer zu kontrollieren. Die meisten guten Marken nutzen beides. So entscheidest du, was jede Fläche braucht.

Farbverläufe

Farbverlauf-Textur: Körnung, Papier, Glas und Seide erklärt

4 Min. Lesezeit

Zwei Farbverläufe mit identischen Farben können wie ein Filmstill, eine Letterpress-Karte, ein Smartphone-Display oder ein Abendkleid wirken. Der Unterschied ist die Textur, und sie sagt mehr als die Farben.

Farbverläufe

Glassmorphism und Farbverläufe: ein praktischer Leitfaden

5 Min. Lesezeit

Mattglas über einem leuchtenden Farbverlauf ist einer der schönsten Effekte im Interface-Design und einer der leichtesten, die unlesbar werden. So bekommst du die Schönheit und behältst die Wörter.

Farbverläufe

Verlaufsumsetzung: Bilder in Sekunden neu einfärben

4 Min. Lesezeit

Eine Verlaufsumsetzung nimmt jedes Bild, Foto, jede Textur oder Illustration und malt es in den Farben neu, die du wählst, und behält dabei Licht und Schatten. Es ist das schnellste Werkzeug zum Umfärben.

Farbverläufe

Farbverlauf-Winkel und Richtung: wohin er laufen sollte

5 Min. Lesezeit

Dieselben zwei Farben können ruhig, beflügelnd oder unruhig wirken, nur je nachdem, in welche Richtung sie laufen. So wählst du eine Richtung bewusst und bekommst den Winkel im Code genau richtig.

Farbverläufe

Neun Farbverlauf-Fehler, die Designs billig wirken lassen

5 Min. Lesezeit

Die meisten Farbverläufe, die billig aussehen, scheitern auf eine von neun vorhersehbaren Arten. Hier ist jeder Fehler, seine Ursache und die konkrete Änderung, die ihn behebt.

Farbverläufe

Radialer Farbverlauf: der Scheinwerfer, der den Blick lenkt

5 Min. Lesezeit

Ein radialer Farbverlauf ist das, was im Design am ehesten einem Licht entspricht, das du auf etwas richtest. So zielst du damit, bestimmst die Größe und verhinderst, dass er wie eine Zielscheibe aussieht.

Farbverläufe

Konische Farbverläufe: Farbkreise, Diagramme und Glanz

4 Min. Lesezeit

Lineare Verläufe wandern, radiale breiten sich aus, und konische drehen sich. Dieser eine Unterschied macht sie zum richtigen Werkzeug für Farbkreise, Diagramme, Metall und Lichtstrahlen.

Farbverläufe

Farbverläufe drucken ohne Banding und Matsch

6 Min. Lesezeit

Ein Verlauf, der auf dem Bildschirm leuchtet, kann flach, gestreift oder braun aus der Druckerei zurückkommen. Fast jeder dieser Fehler ist vorhersehbar, und die meisten lassen sich beheben, bevor die Datei deinen Schreibtisch verlässt.