Alle Bildschirmtestwerkzeuge

    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

    Verwenden Sie ganze Zahlen von 1 bis 8192 pro Seite und insgesamt höchstens 16,777,216 Pixel. Die Bilder werden in Ihrem Browser erstellt.

    HEX · #RRGGBB
    HEX · #RRGGBB

    Live-Vorschau

    1920 × 1080 px
    Generator für Farbverlaufsbilder

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

    Gradiententest

    So funktioniert es

    1. Legen Sie die Bildmaße fest und wählen Sie einen linearen oder radialen Verlauf.
    2. Wählen Sie Anfangs- und Endfarbe, fügen Sie bei Bedarf eine mittlere Farbe hinzu und stellen Sie den linearen Winkel ein.
    3. 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