Dégradé Wandering Matcha

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

PastelJaunesBleu-vert

Étapes

HEXRGBOKLCHPosition
#F4E7B2 rgb(244, 231, 178) oklch(92.6% 0.07 95.9) 0%
#93EDDD rgb(147, 237, 221) oklch(88.5% 0.09 181.6) 50%
#EEEDFF rgb(238, 237, 255) oklch(95.2% 0.024 288.5) 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(270deg, #F4E7B2, #93EDDD, #EEEDFF);
background: linear-gradient(270deg in oklch, #F4E7B2, #93EDDD, #EEEDFF);

Tailwind CSS v4

bg-linear-270/oklch from-[#F4E7B2] via-[#93EDDD] to-[#EEEDFF]

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.