CSS Verlauf Generator

Erstelle kostenlos wunderschöne CSS-Verläufe online. Gestalte lineare und radiale Gradienten mit mehreren Farbstopps und kopiere den CSS-Code sofort.

Preview
CSS Code

So funktioniert es

  1. Wählen Sie den Verlaufstyp – linear oder radial – je nach Ihrem Designbedarf.
  2. Fügen Sie Farbstopps hinzu, indem Sie auf den Schieberegler klicken und die gewünschten Farben aus dem Farbwähler auswählen.
  3. Passen Sie den Winkel oder die Richtung des Verlaufs mit dem Drehregler an.
  4. Betrachten Sie das Ergebnis in Echtzeit im Vorschaubereich.
  5. Kopieren Sie den generierten CSS-Code mit einem Klick und fügen Sie ihn direkt in Ihr Projekt ein.

Beispiel

Eingabe: Linearer Verlauf: von #F7971E (0%) zu #FFD200 (100%), Winkel 180°
Ergebnis: background: linear-gradient(180deg, #F7971E 0%, #FFD200 100%);

FAQ

Ja, absolut. Die gesamte Verarbeitung erfolgt direkt in Ihrem Browser. Es werden keine Daten an einen Server gesendet, sodass Ihre Arbeit vollständig privat bleibt.

Ja, Sie können beliebig viele Farbstopps hinzufügen, um komplexe mehrfarbige Verläufe zu erstellen.

Der generierte Code ist mit allen modernen Browsern kompatibel. Das Tool fügt automatisch die erforderlichen Präfixe für eine breitere Kompatibilität hinzu.

Ein linearer Verlauf geht von einer Farbe entlang einer geraden Linie zu einer anderen über, während ein radialer Verlauf von einem Mittelpunkt nach außen in einer kreisförmigen Form strahlt.

Nein, das Tool ist vollständig kostenlos und ohne Registrierung nutzbar. Einfach öffnen und loslegen.