Farbverlauf Quiet Clearing

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

WaldGrün

Stopps

HEXRGBOKLCHPosition
#A2D1B7 rgb(162, 209, 183) oklch(82% 0.061 160.5) 0%
#667843 rgb(102, 120, 67) oklch(54.5% 0.079 124.3) 50%
#222100 rgb(34, 33, 0) oklch(24.1% 0.052 108.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(200deg, #A2D1B7, #667843, #222100);
background: linear-gradient(200deg in oklch, #A2D1B7, #667843, #222100);

Tailwind CSS v4

bg-linear-200/oklch from-[#A2D1B7] via-[#667843] to-[#222100]

Mach sie zu deiner

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