Zum Inhalt springen
Musterli
Verläufe

Flüssiges Chrom (Liquid Chrome)

Geschmolzenes Metall aus einem Shader: Quecksilber, Gold, schwarzes Chrom oder schillernder Ölfilm mit echten Spiegelungen und Glanzlichtern. PNG bis 8K, nahtlose GIF-Schleife oder Live-Code für deine Website.

Generator öffnen

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

Beispielmotiv aus dem Flüssiges Chrom

Mit einem Preset starten

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

Worum geht’s?

Flüssiges Chrom ist der Look von geschmolzenem, spiegelndem Metall: weiche Falten, die das Licht einfangen und helle und dunkle Bänder spiegeln. Musterli baut aus Rauschen eine fliessende Oberfläche, berechnet, wie das Licht daran abprallt, und schickt die Spiegelung durch deine Farben. So entstehen Chrom, Gold oder schillerndes Metall ohne 3D-Software, direkt in deinem Browser.

Wofür du es brauchst

  • Y2K-Look und Musik-Artwork

    Chromflächen sind ein Klassiker für Albumcover, Plakate und Mode. Exportier im Quadrat- oder Story-Format und setz Schrift darüber.

  • Produktlancierungen

    Ein langsam fliessender Metallhintergrund hinter einem Produktbild wirkt edel. Füg ihn als Live-Einbettung in deine Landingpage ein.

  • Wallpaper

    Schwarzes Chrom oder mattes Silber passt als ruhiges Hintergrundbild für Desktop und Handy, scharf bis 8K.

So geht’s

Wähl zwei bis sechs Farben für die Spiegelung und eine Farbe für das Glanzlicht. Frequenz und Fluss formen die Falten, das Relief macht sie tiefer, und Spiegelungen bestimmt, wie viele helle Bänder erscheinen. Schillern legt einen Regenbogenschimmer wie Öl auf Wasser darüber. Die Leertaste würfelt eine neue Variante. Exportier als PNG, JPG oder WebP bis 8K, als nahtlose GIF-Schleife oder als Live-Code für deine Website.

Flüssiges Chrom jetzt ausprobieren

Tipps

  • Dunkle und helle Farben im Wechsel geben den stärksten Chromeffekt. Eine Palette von Schwarz bis Weiss wirkt wie echtes Spiegelmetall.
  • Wenig Relief ergibt seidiges Metall, viel Relief tiefe, glänzende Falten.
  • Dreh Schillern hoch und Glanz herunter für einen Ölfilm, umgekehrt für sauberes Chrom.

Häufige Fragen

Wird das in 3D gerechnet?
Nein. Der Shader berechnet für jedes Pixel eine Oberfläche und ihr Licht in 2D. Das ist viel schneller als eine 3D-Szene, sieht trotzdem nach echten Spiegelungen aus und läuft in jedem aktuellen Browser mit WebGL2.
Kann ich das als bewegten Website-Hintergrund verwenden?
Ja. Wähl im Export-Dialog Web Component, React-Komponente oder HTML-Einbettung. Das Metall fliesst live im Browser der Besucher, pausiert ausserhalb des Bildschirms und steht still, wenn jemand weniger Bewegung eingestellt hat.
Sieht der Export genauso aus wie die Vorschau?
Ja. Vorschau und Export nutzen denselben Shader mit denselben Werten. Grosse Exporte bis 8K rechnet Musterli in Kacheln ohne sichtbare Nähte.
Kann ich meine Markenfarben verwenden?
Ja. Mit einer Palette aus deinem Brand Kit laufen die Spiegelungen durch deine Markenfarben. Die Leertaste ändert dann nur noch die Form des Metalls.

Fertige Farbverläufe

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

Zur Verlaufssammlung
Alle Generatoren in Verläufe
  • Mesh-Verlauf

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

    Im Editor öffnen
  • Shader-Farbverlauf

    Fliessende, seidige und körnige Verläufe aus einem Shader auf der Grafikkarte. Mit Domain Warping, Bayer-Dithering, Körnung und Vignette. PNG, JPG und WebP bis 8K, nahtlose GIF-Schleifen und Live-Code für deine Website.

    Im Editor öffnen