Generator für Farbverlaufsbilder
Erstellen Sie einen linearen oder radialen Verlauf mit zwei oder drei Farben. Legen Sie Winkel und Bildgröße fest, laden Sie einen Verlaufshintergrund herunter oder kopieren Sie den CSS-Code.
- Lineare und radiale Verläufe
- Bilddownload und CSS
Live-Vorschau
1920 × 1080 pxDie Vorschau wird passend skaliert. Die heruntergeladene Datei hat exakt die oben angegebenen Pixelmaße.
background: linear-gradient(90deg, #2563eb, #e879f9);CSS und PNG können sich leicht unterscheiden, weil Browser Farben unterschiedlich interpolieren.
So funktioniert es
- Legen Sie die Bildmaße fest und wählen Sie einen linearen oder radialen Verlauf.
- Wählen Sie Anfangs- und Endfarbe, fügen Sie bei Bedarf eine mittlere Farbe hinzu und stellen Sie den linearen Winkel ein.
- Laden Sie PNG oder JPEG herunter oder kopieren Sie die CSS-Hintergrunddeklaration.
Bedingungen und Grenzen
Dieses Werkzeug erstellt dekorative Verlaufshintergründe. Zum Prüfen von Farbabstufungen dient der separate Verlaufstest. Ein erzeugtes Bild kann weder Bittiefe noch Farbgenauigkeit Ihres Displays bestätigen.
Häufige Fragen
Was bedeutet der Winkel des Farbverlaufs?
Die Winkel folgen CSS: 0° verläuft von unten nach oben, 90° von links nach rechts und 180° von oben nach unten. Radiale Verläufe beginnen in der Mitte.
Entspricht der heruntergeladene Verlauf exakt dem CSS?
Farben und Richtung sind gleich, doch Farbinterpolation im Browser und Bildskalierung können kleine Unterschiede erzeugen. Verwenden Sie das heruntergeladene Bild, wenn ein festes Pixelergebnis wichtig ist.
Weitere Tools entdecken
Erstellen Sie ein vollständig transparentes, leeres PNG in beliebiger eigener Größe. Prüfen Sie die Transparenz in der Vorschau und laden Sie das Bild für Layouts, Overlays oder Entwürfe herunter.
Generator für einfarbige BilderErstellen Sie ein einfarbiges Bild mit eigener HEX-Farbe und exakten Abmessungen. Laden Sie PNG oder JPEG als schlichtes Hintergrundbild, Fläche oder visuelle Bildschirmreferenz herunter.
Generator für PlatzhalterbilderErzeugen Sie ein Platzhalterbild mit Größenangabe oder eigenem Text. Wählen Sie Hintergrund- und Textfarbe, legen Sie exakte Maße fest und laden Sie PNG oder JPEG für Mockups herunter.