Design

Kostenloser CSS-Gradient-Generator

Erstellen Sie visuell schöne CSS-Gradienten. Wählen Sie Farben, passen Sie den Winkel an, wählen Sie linear oder radial und kopieren Sie das generierte CSS. Enthält Gradient-Vorlagen für schnelle Inspiration. Keine Anmeldung erforderlich.

100% kostenlos — kein Konto erforderlich

background: linear-gradient(135deg, #6366f1, #ec4899);
Voreinstellungen

Funktionen von Kostenloser CSS-Gradient-Generator

Visueller Gradient-Builder mit Live-Vorschau

CSS kopieren

Ein-Klick-Kopie der generierten CSS-Background-Eigenschaft.

6 Gradient-Vorlagen

Starten Sie mit schönen Vorlagen wie Sunset, Ocean, Forest, Lavender, Cherry und Midnight.

Zufällig

Generieren Sie zufällige Gradient-Kombinationen zur Inspiration.

Linear & Radial

Wechseln Sie zwischen linearen und radialen Gradient-Typen mit einstellbarem Winkel.

Häufig gestellte Fragen

Was ist der Unterschied zwischen linear und radial?

Lineare Gradienten verlaufen in einer geraden Linie in einem bestimmten Winkel. Radiale Gradienten verlaufen von einem Mittelpunkt nach außen in einem kreisförmigen oder elliptischen Muster.

Kann ich mehr als 2 Farben verwenden?

Dieses Tool unterstützt 2-Farben-Gradienten. Für Multi-Stop-Gradienten verwenden Sie das generierte CSS als Ausgangspunkt und fügen Sie Farbstopps manuell hinzu.

Funktionieren CSS-Gradienten in allen Browsern?

Ja. CSS-Gradienten haben hervorragende Browser-Unterstützung in allen modernen Browsern einschließlich Chrome, Firefox, Safari und Edge.

Gefallen Ihnen unsere kostenlosen Tools?

Erstellen Sie markenkonforme Visuals

Verwenden Sie individuelle Gradienten in Ihren Social-Media-Grafiken mit AdaptlyPost.