Was Farbverlauf-Generator ist
Der Generator baut einen linearen Farbverlauf aus zwei oder drei Farben und einem einstellbaren Winkel. Die Vorschau aktualisiert sich sofort, und eine fertige CSS-Zeile lässt sich mit einem Klick kopieren.
Arbeitsschritte
- Start-, Mittel- und Endfarbe wählen
- Winkel mit dem Regler einstellen
- CSS-Zeile kopieren
Zu beachten:Die Ausgabe folgt der CSS-Syntax linear-gradient(Winkel, Farbe 0 %, Farbe 100 %). Die Mittelfarbe sitzt fest bei 50 %. Die Regel lässt sich direkt in ein Stylesheet übernehmen.
Was das Werkzeug kann
- Zwei- oder Drei-Farb-Verlauf
- Winkel von 0 bis 360 Grad
- Live-Vorschau während der Einstellung
- Fertige CSS-Zeile zum Kopieren
Fragen und Antworten
Was bedeutet der Winkel?
0 Grad zeigt nach oben, 90 Grad von links nach rechts. Der Wert dreht den Verlauf in der angegebenen Richtung.
Kann ich auch radiale Verläufe bauen?
Dieser Generator konzentriert sich auf lineare Verläufe. Radiale Verläufe setzt das CSS-Gradient-Werkzeug um.
Wie übernehme ich das Ergebnis?
Auf Kopieren klicken und die Zeile in die eigene CSS-Datei einfügen. Sie enthält die background-Angabe.
Wird mein Entwurf gespeichert?
Nein. Die Einstellungen liegen nur im Browser und gehen beim Schließen der Seite verloren.
Typische Anwendungen
- Einen Hintergrund für eine Landingpage bauen
- Einen Banner-Verlauf zum Prototypen entwerfen
- Eine passende Übergangsfarbe für ein Logo finden
Kombinierbar mit
Diese Werkzeuge passen inhaltlich zum Farbverlauf-Generator: