Farbverlauf Sunlit Iris

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

Mesh-OptikRotViolett

Stopps

HEXRGBOKLCHPosition
#FFAD97 rgb(255, 173, 151) oklch(82.2% 0.102 35.7) 0%
#B078DB rgb(176, 120, 219) oklch(66.9% 0.152 308.9) 50%
#006279 rgb(0, 98, 121) oklch(46% 0.084 221.2) 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 20% 80%, #FFAD97, #B078DB, #006279);
background: radial-gradient(circle at 20% 80% in oklch, #FFAD97, #B078DB, #006279);

Tailwind CSS v4

bg-radial-[at_20%_80%]/oklch from-[#FFAD97] via-[#B078DB] to-[#006279]

Mach sie zu deiner

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