Farbverlauf Winter Lantern

Ein CSS-Farbverlauf (linear) aus 3 Farben, von #EDC687 bis #A8CAFF, in OKLCH interpoliert, damit die Mitte lebendig bleibt.

PastellGelbBlau

Stopps

HEXRGBOKLCHPosition
#EDC687 rgb(237, 198, 135) oklch(84.6% 0.092 79) 0%
#FBD0D6 rgb(251, 208, 214) oklch(89.6% 0.049 8.7) 50%
#A8CAFF rgb(168, 202, 255) oklch(83.3% 0.083 259.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: linear-gradient(45deg, #EDC687, #FBD0D6, #A8CAFF);
background: linear-gradient(45deg in oklch, #EDC687, #FBD0D6, #A8CAFF);

Tailwind CSS v4

bg-linear-45/oklch from-[#EDC687] via-[#FBD0D6] to-[#A8CAFF]

Mach sie zu deiner

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