CSS-Verlaufsgenerator
Baue genau den Verlauf, den du meinst.
Wähle die Verlaufsgeometrie, lege Farbstopps und Deckkraft exakt fest und nutze dieselben Werte für Live-Vorschau und exportiertes CSS.
- Exakte Stopp-Positionen
- Harte Übergänge möglich
- Funktioniert in diesem Browser
Verlaufseinstellungen
Jede gültige Änderung aktualisiert Vorschau und CSS sofort. Ungültige Werte bleiben bearbeitbar und werden nicht unbemerkt korrigiert.
Geometrie
Gib einen Winkel von 0 bis 360 ein.
Verwende einen Wert von 0 bis 360.
Gib einen Mittelpunktwert von 0 bis 100 ein.
Gib einen Mittelpunktwert von 0 bis 100 ein.
Verwende Werte von 0 bis 100 für den horizontalen und vertikalen Mittelpunkt.
Farbstopps
Für die CSS-Ausgabe werden Positionen von 0 % bis 100 % sortiert. Stopps an derselben Position behalten ihre Listenreihenfolge, damit harte Kanten möglich sind.
-
{{ t('stops.itemTitle', { number: index + 1 }) }}
Gib eine HEX-Farbe wie #1F4E79 ein.
Deckkraft und Position
%Gib eine Deckkraft von 0 bis 100 ein.
%Gib eine Position von 0 bis 100 ein.
Ein Verlauf benötigt mindestens zwei Stopps.