Dégradé Gentle Harbour

Un dégradé CSS linéaire de 3 couleurs, de #A9E3E0 à #DEBAC5, interpolé en OKLCH pour que le milieu reste vif.

PastelFroidsSubtilsMonochromesBleu-vert

Étapes

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

La première déclaration est un dégradé sRGB simple, pour tous les navigateurs. La seconde interpole en OKLCH, ce qui garde le milieu aussi vif que les extrémités.

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]

Faites-la vôtre

Modifiez les étapes, l’angle et le type dans le Créateur de dégradés, ou transformez les étapes en palette.