Was ist ein CSS-Gradient-Generator?
Ein CSS-Gradient-Generator erstellt sanfte Farbübergänge für Webdesign-Hintergründe. Dieses Tool erzeugt lineare Verläufe mit zwei anpassbaren Farben und einem verstellbaren Winkel und produziert gebrauchsfertigen CSS-Code.
So verwenden Sie diesen Gradient-Generator
- Geben Sie zwei Hex-Farbcodes in den Feldern Farbe 1 und Farbe 2 ein und stellen Sie den Winkel in Grad ein.
- Der CSS linear-gradient-Code wird automatisch aktualisiert, während Sie eingeben. Klicken Sie auf „Generieren", um eine zufällige Farbkombination zu laden.
- Kopieren Sie den generierten CSS-Code für Ihr Stylesheet.
Wichtige Konzepte
Lineare Verläufe erfolgen entlang einer geraden Linie in einem bestimmten Winkel. Dieses Tool generiert lineare Verläufe mit zwei Farbstopps und einem konfigurierbaren Winkel. CSS-Verläufe sind eine auflösungsunabhängige, dateigröße-freie Alternative zu Verlaufsbildern und verbessern die Seitenleistung.
Häufig gestellte Fragen
Kann ich Verläufe auf Text verwenden?
Ja. Wenden Sie background-clip: text an und setzen Sie die Textfarbe auf transparent. Der Verlauf erscheint dann durch die Textform. Diese Technik funktioniert in allen modernen Browsern.
Wie viele Farbstopps kann ich verwenden?
Dieses Tool unterstützt zwei Farbstopps. Sie können den generierten CSS manuell bearbeiten, um weitere Stopps für Mehrfarbübergänge hinzuzufügen.
Beeinflussen Verläufe die Seitenleistung?
CSS-Verläufe werden von der Browser-GPU gerendert und haben im Vergleich zu Verlaufsbildern einen vernachlässigbaren Einfluss auf die Leistung. Sie skalieren auch perfekt bei jeder Auflösung.