Farbverlauf Warm Evergreen

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

RegenbogenOrange

Stopps

HEXRGBOKLCHPosition
#F98D2B rgb(249, 141, 43) oklch(74.6% 0.166 56.9) 0%
#7EBA40 rgb(126, 186, 64) oklch(72.3% 0.165 131.8) 33%
#00C8DA rgb(0, 200, 218) oklch(76.1% 0.13 206.3) 67%
#A3A7FF rgb(163, 167, 255) oklch(76% 0.126 281) 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(0deg, #F98D2B, #7EBA40, #00C8DA, #A3A7FF);
background: linear-gradient(0deg in oklch, #F98D2B, #7EBA40, #00C8DA, #A3A7FF);

Tailwind CSS v4

bg-linear-[0deg_in_oklch,#F98D2B,#7EBA40,#00C8DA,#A3A7FF]

Mach sie zu deiner

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