Farbverlauf Gentle Harbour

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

PastellKühlDezentMonochromTürkis

Stopps

HEXRGBOKLCHPosition
#A9E3E0 rgb(169, 227, 224) oklch(87.5% 0.059 192.1) 0%
#CAE6FF rgb(202, 230, 255) oklch(91.2% 0.045 245.3) 50%
#DEBAC5 rgb(222, 186, 197) oklch(82.3% 0.044 357.8) 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(0deg, #A9E3E0, #CAE6FF, #DEBAC5);
background: linear-gradient(0deg in oklch, #A9E3E0, #CAE6FF, #DEBAC5);

Tailwind CSS v4

bg-linear-0/oklch from-[#A9E3E0] via-[#CAE6FF] to-[#DEBAC5]

Mach sie zu deiner

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