Farbverlauf Warm Copper

Ein CSS-Farbverlauf (linear) aus 4 Farben, von #F77EC4 bis #00D1D7, in OKLCH interpoliert, damit die Mitte lebendig bleibt.

RegenbogenRosa

Stopps

HEXRGBOKLCHPosition
#F77EC4 rgb(247, 126, 196) oklch(75% 0.167 346.1) 0%
#EC862A rgb(236, 134, 42) oklch(71.7% 0.158 56.9) 33%
#A4CC6D rgb(164, 204, 109) oklch(79.5% 0.131 127.8) 67%
#00D1D7 rgb(0, 209, 215) oklch(78.1% 0.133 198.5) 100%

CSS

Die erste Deklaration ist ein einfacher sRGB-Farbverlauf für jeden Browser. Die zweite interpoliert in OKLCH, wodurch die Mitte so lebendig bleibt wie die Enden.

background: linear-gradient(90deg, #F77EC4, #EC862A, #A4CC6D, #00D1D7);
background: linear-gradient(90deg in oklch, #F77EC4, #EC862A, #A4CC6D, #00D1D7);

Tailwind CSS v4

bg-linear-[90deg_in_oklch,#F77EC4,#EC862A,#A4CC6D,#00D1D7]

Mach sie zu deiner

Ändere Stopps, Winkel und Typ im Farbverlauf-Generator oder mach aus den Stopps eine Palette.