Farbverlauf Tender Fern

Ein CSS-Farbverlauf (radial) aus 3 Farben, von #FFC87B bis #245F92, in OKLCH interpoliert, damit die Mitte lebendig bleibt.

Mesh-OptikOrangeGrün

Stopps

HEXRGBOKLCHPosition
#FFC87B rgb(255, 200, 123) oklch(86.6% 0.114 74.7) 0%
#00B97C rgb(0, 185, 124) oklch(69.4% 0.155 160.8) 50%
#245F92 rgb(36, 95, 146) oklch(47.3% 0.103 248.1) 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: radial-gradient(circle at 50% 100%, #FFC87B, #00B97C, #245F92);
background: radial-gradient(circle at 50% 100% in oklch, #FFC87B, #00B97C, #245F92);

Tailwind CSS v4

bg-radial-[at_50%_100%]/oklch from-[#FFC87B] via-[#00B97C] to-[#245F92]

Mach sie zu deiner

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