◉◎

Mesh-Verlauf-Generator

Weiche mehrfarbige „Aurora“-Hintergründe in reinem CSS.

Farben (erste = Grundfarbe)

Variante

Ergebnis

background-color: #0f172a;
background-image:
  radial-gradient(at 52% 50%, #7c3aed 0px, transparent 62%),
  radial-gradient(at 36% 92%, #ec4899 0px, transparent 47%),
  radial-gradient(at 98% 83%, #22d3ee 0px, transparent 58%),
  radial-gradient(at 19% 18%, #f59e0b 0px, transparent 61%);

Läuft komplett in deinem Browser. Nichts wird irgendwohin gesendet.

So funktioniert es

1Füge deinen Text ein oder tippe ihn.
2Wähle die gewünschten Optionen.
3Kopiere das Ergebnis oder lade es herunter.

Über dieses Tool

Mesh-Verlauf-Generator: Weiche mehrfarbige „Aurora“-Hintergründe in reinem CSS. Füge deinen Text ein und das Ergebnis erscheint sofort, bereit zum Kopieren oder Herunterladen. Alles passiert lokal im Browser — nichts wird hochgeladen oder gespeichert.

Beispiel

Eingabe

#0f172a #7c3aed #ec4899 #22d3ee #f59e0b

Ausgabe

background-color: #0f172a;
background-image:
  radial-gradient(at 52% 50%, #7c3aed 0px, transparent 62%),
  radial-gradient(at 36% 92%, #ec4899 0px, transparent 47%),
  radial-gradient(at 98% 83%, #22d3ee 0px, transparent 58%),
  radial-gradient(at 19% 18%, #f59e0b 0px, transparent 61%);

Wie benutze ich Mesh-Verlauf-Generator?

Füge deinen Text ein oder tippe ihn. Wähle die gewünschten Optionen. Kopiere das Ergebnis oder lade es herunter.

Ist Mesh-Verlauf-Generator kostenlos?

Ja. Komplett kostenlos, ohne Anmeldung, ohne Nutzungslimit und ohne Wasserzeichen.

Werden meine Daten an einen Server gesendet?

Nein. Alles wird lokal in deinem Browser berechnet. Nichts, was du eingibst, wird hochgeladen, protokolliert oder gespeichert.

Funktioniert es auf dem Handy?

Ja. Es läuft in jedem modernen Browser auf Android, iPhone, iPad, Windows, Mac und Linux — ohne App.

Mesh-Verlauf-Generator

So funktioniert es

Über dieses Tool

Beispiel

Verwandte Tools