Was ist Verlaufsgenerator?

Ein visueller CSS-Gradient-Builder, mit dem du lineare, radiale und konische Verläufe mit beliebig vielen Farbstopps erstellen kannst. Passe Winkel, Positionen und Farben in Echtzeit an und kopiere den produktionsfertigen CSS-Code mit einem Klick.

Anleitung

1. Schritt 1 — Wähle den Verlaufstyp (linear, radial oder konisch) und lege die Richtung oder den Winkel mit dem Winkelschieberegler oder den Voreinstellungsschaltflächen fest.
2. Schritt 2 — Füge Farbstopps hinzu, indem du auf die Verlaufsleiste klickst. Passe Farbe und Position jedes Stopps per Drag-and-Drop oder durch direkte Werteingabe an.
3. Schritt 3 — Sieh dir eine Live-Vorschau des Verlaufs an und kopiere dann den generierten CSS-Code in die Zwischenablage oder lade ihn als CSS-Datei herunter.

Ergebnis

Ein Webdesigner benötigt einen Sonnenuntergangs-Hintergrund für seinen Hero-Bereich. Er wählt einen linearen Verlauf mit 135°, setzt einen orangefarbenen Stopp bei 0 %, einen rosafarbenen bei 50 % und einen lila bei 100 % — und kopiert den CSS-Code direkt in sein Stylesheet.

Ähnliche Tools