KolorPal

Verlauf #2196F3 zu #FF9800

Ein weicher Verlauf von #2196F3 zu #FF9800. Kopiere den CSS-Code unten, um diesen Verlauf in deinen Projekten zu verwenden.

Farbstopps

Farbe Start

#2196F3

rgb(33, 150, 243)

hsl(207, 90%, 54%)

Farbe Ende

#FF9800

rgb(255, 152, 0)

hsl(36, 100%, 50%)

CSS-Verlaufscode

Linear (135deg)

background: linear-gradient(135deg, #2196F3, #FF9800);

Horizontal

background: linear-gradient(to right, #2196F3, #FF9800);

Radial

background: radial-gradient(circle, #2196F3, #FF9800);

Tailwind-CSS-Klassen

Tailwind

bg-gradient-to-r from-[#2196F3] to-[#FF9800]

Richtungsvarianten

Horizontal

Vertikal

Diagonal

Ecke

Häufige Fragen

Wie erstelle ich einen Verlauf von #2196F3 zu #FF9800?▾

Nutze die CSS-Eigenschaft: linear-gradient(135deg, #2196F3, #FF9800). Weise sie der background-Eigenschaft eines beliebigen Elements zu. Über den Winkel (135deg) änderst du die Richtung des Verlaufs.

Welche CSS-Eigenschaft erzeugt einen Verlauf?▾

Verläufe entstehen über die CSS-Eigenschaft background oder background-image mit Verlaufsfunktionen wie linear-gradient(), radial-gradient() oder conic-gradient(). Zum Beispiel: background: linear-gradient(to right, #2196F3, #FF9800);

Wie nutze ich diesen Verlauf in Tailwind CSS?▾

In Tailwind CSS nutzt du die Utility-Klassen: "bg-gradient-to-r from-[#2196F3] to-[#FF9800]". Die from- und to-Klassen setzen die Farbstopps. Ändere bg-gradient-to-r zu bg-gradient-to-br für eine diagonale Richtung.

Verwandte Ressourcen