Farbverlauf Lazy Iris

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

KühlBlauRosa

Stopps

HEXRGBOKLCHPosition
#E886D2 rgb(232, 134, 210) oklch(74.9% 0.151 335.9) 0%
#C3B3FF rgb(195, 179, 255) oklch(80.7% 0.107 293.5) 50%
#005EA9 rgb(0, 94, 169) oklch(47.8% 0.141 251.5) 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, #E886D2, #C3B3FF, #005EA9);
background: linear-gradient(45deg in oklch, #E886D2, #C3B3FF, #005EA9);

Tailwind CSS v4

bg-linear-45/oklch from-[#E886D2] via-[#C3B3FF] to-[#005EA9]

Mach sie zu deiner

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