6XC

CSS-Farbverlauf-Generator

Gestalten Sie lineare, radiale und konische CSS-Farbverläufe mit Live-Vorschau und kopieren Sie den Code.

841 Aufrufe

CSS-Farbverläufe

Ein Farbverlauf ist ein weicher Übergang zwischen Farben, geschrieben als linear-gradient(Winkel, Farbe1, Farbe2), radial-gradient(...) oder conic-gradient(...). Wählen Sie den Typ, den Winkel und bis zu drei Farben — die Vorschau und das kopierbereite CSS aktualisieren sich sofort. Farbverläufe werden vom Browser gerendert, kosten also keinen Bilddownload und bleiben in jeder Größe gestochen scharf.

Häufig gestellte Fragen

Was bedeutet der Winkel bei einem linearen Farbverlauf?

0° zeigt nach oben, 90° nach rechts, 180° nach unten — der Winkel gibt die Richtung an, in die sich der Farbverlauf bewegt. 135° ergibt die beliebte Diagonale von oben links nach unten rechts.

Wann sollte ich radial oder conic verwenden?

Radial mischt sich vom Zentrum nach außen — gut für Spotlights und Vignetten. Conic verläuft wie ein Farbrad um das Zentrum — gut für Kreisdiagramme und Regenbogenringe.

Ähnliche Tools

CSS-Box-Shadow-Generator Gestalten Sie einen box-shadow visuell — Versatz, Unschärfe, Ausdehnung, Farbe, Deckkraft und Inset — mit Live-Vorschau. Erstellen CSS Border-Radius-Generator Runden Sie jede Ecke einzeln oder alle zusammen, in px oder %, mit Live-Vorschau und kopierbarem CSS. Erstellen CSS Text-Schatten-Generator Gestalten Sie einen text-shadow mit Versatz, Unschärfe, Farbe und Deckkraft — Live-Vorschau an Beispieltext. Erstellen CSS-Glasmorphismus-Generator Gestalten Sie einen Glaseffekt (Glasmorphismus) mit Live-Vorschau — passen Sie Unschärfe, Transparenz, Farbton und Rahmen an und kopieren Sie das CSS. Erstellen