Farbverlauf Easy Basil

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

ErdigGelbGrün

Stopps

HEXRGBOKLCHPosition
#434100 rgb(67, 65, 0) oklch(36.5% 0.079 107.8) 0%
#768C50 rgb(118, 140, 80) oklch(60.8% 0.088 125.4) 50%
#A7D3B2 rgb(167, 211, 178) oklch(82.6% 0.065 152.4) 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(315deg, #434100, #768C50, #A7D3B2);
background: linear-gradient(315deg in oklch, #434100, #768C50, #A7D3B2);

Tailwind CSS v4

bg-linear-315/oklch from-[#434100] via-[#768C50] to-[#A7D3B2]

Mach sie zu deiner

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