Farbverlauf Slow Aubergine

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

Mesh-OptikViolettRosa

Stopps

HEXRGBOKLCHPosition
#FFDBC2 rgb(255, 219, 194) oklch(91.5% 0.052 56.8) 0%
#CB5597 rgb(203, 85, 151) oklch(62% 0.166 348.3) 50%
#300997 rgb(48, 9, 151) oklch(33.7% 0.196 280.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 0% 0%, #FFDBC2, #CB5597, #300997);
background: radial-gradient(circle at 0% 0% in oklch, #FFDBC2, #CB5597, #300997);

Tailwind CSS v4

bg-radial-[at_0%_0%]/oklch from-[#FFDBC2] via-[#CB5597] to-[#300997]

Mach sie zu deiner

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