Design Auf dem Gerät · Kein Upload

Kostenloser CSS-Farbverlauf-Generator

Erstellen Sie lineare und radiale CSS-Farbverläufe visuell, sehen Sie die Vorschau sofort und kopieren Sie den generierten CSS-Code.

Der CSS-Gradient-Generator erzeugt lineare oder radiale CSS-Gradienten mit einstellbarem Winkel und bis zu drei Farbstopps — mit Live-Vorschau und Ein-Klick-Kopie der erzeugten CSS-Regel. Enthält Fertig-Presets (Sunset, Ocean, Purple Glow, Soft Gray) und Richtungs-Shortcuts. Läuft vollständig im Browser — kein Upload, keine Anmeldung, kein Konto. Erstellt von FreeToolHub.

Verlaufstyp

Winkel
deg
Farbstopps

Vorschau

CSS-Ausgabe

background: linear-gradient(90deg, #ff7e5f 0%, #feb47b 100%);

Schnellvorlagen

Erstellen Sie schöne CSS-Farbverläufe für Websites, Schaltflächen, Hintergründe und UI-Elemente.

Häufig gestellte Fragen

Was ist ein CSS-Farbverlauf?

Ein CSS-Farbverlauf ist ein fließender Übergang zwischen zwei oder mehr Farben, der vollständig in CSS definiert ist, ohne Bilddateien zu benötigen. Verläufe können als Hintergrund auf jedes Element angewendet werden.

Was ist der Unterschied zwischen linearen und radialen Verläufen?

Ein linearer Verlauf wechselt die Farben entlang einer geraden Linie in einem bestimmten Winkel. Ein radialer Verlauf wechselt die Farben von einem Mittelpunkt aus in kreisförmiger oder elliptischer Form.

Kann ich den generierten CSS-Code kopieren?

Ja. Klicken Sie auf CSS kopieren, um nur den CSS-Verlaufsausschnitt in die Zwischenablage zu kopieren. Sie können ihn direkt in Ihr Stylesheet einfügen.

Wie viele Farbstopps kann ich verwenden?

Dieser Generator unterstützt bis zu 3 Farbstopps. Jeder Stopp hat eine Farbe und eine Position von 0 % bis 100 %.

Speichert dieses Tool meine Einstellungen?

Nein. Alle Verlaufseinstellungen sind lokal in Ihrer Browsersitzung. Nichts wird gespeichert oder an einen Server gesendet.

Ist dieser Generator kostenlos?

Ja. Der CSS-Farbverlauf-Generator ist völlig kostenlos, ohne Registrierung und ohne Einschränkungen.