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 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

Angenommen, du möchtest einen Sonnenuntergangs-Hintergrund für deinen Hero-Bereich. Wähle einen linearen Verlauf mit 135°, setze Orange auf 0%, Rosa auf 50% und Lila auf 100%, dann kopiere den CSS-Code in dein Stylesheet.

Ähnliche Tools