Zum Inhalt springen
Musterli

Mesh-Verlauf

Weiche, fliessende Farbverläufe aus mehreren unscharfen Farbflächen. Als PNG, JPG, WebP, SVG oder CSS exportieren.

Generator öffnen

Läuft direkt in deinem Browser. Deine Grafiken entstehen auf deinem Gerät.

Beispielmotiv aus dem Mesh-Verlauf

Mit einem Preset starten

Wähle ein Preset, es öffnet sich direkt im Editor. Dort passt du alles an.

Worum geht’s?

Ein Mesh-Verlauf mischt mehrere Farben über die ganze Fläche statt entlang einer Linie. Das Ergebnis wirkt wie weiches, fliessendes Licht und passt zu Website-Headern, App-Hintergründen, Präsentationen und Social-Media-Posts.

So geht’s

Wähle deine Farben und einen Hintergrund, lege fest, wie viele Farbflächen sich mischen und wie stark sie verzerrt und weichgezeichnet werden, und füge bei Bedarf Körnung hinzu. Mit der Leertaste würfelst du eine neue Anordnung. Exportiere dann als PNG, JPG, WebP, SVG oder CSS in der Grösse, die du brauchst.

Mesh-Verlauf jetzt ausprobieren

Häufige Fragen

Was unterscheidet einen Mesh-Verlauf von einem normalen Verlauf?
Ein linearer oder radialer Verlauf läuft entlang einer Linie oder von einem Punkt aus. Ein Mesh-Verlauf verteilt mehrere Farben frei auf der Fläche und mischt sie weich. Darum wirkt er organisch statt technisch.
Kann ich das SVG in einem Grafikprogramm bearbeiten?
Das SVG enthält einfache Formen und einen einzigen Standard-Weichzeichner (Gausscher Weichzeichner), den Browser und viele Grafikprogramme darstellen. Grafikprogramme unterstützen SVG-Filter unterschiedlich gut. Sieht die Unschärfe dort anders aus, nimm den PNG-Export.
Wozu dient die Körnung?
Feine Körnung gibt der Fläche einen weichen, analogen Look und kaschiert Banding, also sichtbare Stufen in glatten Verläufen. Mit Körnung 0 bleibt der Verlauf ganz glatt.
Sieht der Export aus wie die Vorschau?
Ja. Vorschau und Export verwenden dieselbe Grafik, und die Anordnung wird aus dem Seed berechnet. Gleiche Einstellungen und gleicher Seed ergeben immer denselben Verlauf.

Fertige Farbverläufe

Über 30 eigene Verläufe mit CSS-Code zum Kopieren, jeder direkt im Editor anpassbar.

Zur Verlaufssammlung

Passende Generatoren

Alle Generatoren in Verläufe