Dégradé Zesty Mint Julep

Un dégradé CSS linéaire de 4 couleurs, de #36C0FF à #35D16F, interpolé en OKLCH pour que le milieu reste vif.

VibrantsArc-en-cielVerts

Étapes

HEXRGBOKLCHPosition
#36C0FF rgb(54, 192, 255) oklch(76.3% 0.144 233.7) 0%
#EA80EE rgb(234, 128, 238) oklch(75.4% 0.187 325.9) 33%
#EF9447 rgb(239, 148, 71) oklch(74.7% 0.142 58.1) 67%
#35D16F rgb(53, 209, 111) oklch(76% 0.187 150.9) 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(120deg, #36C0FF, #EA80EE, #EF9447, #35D16F);
background: linear-gradient(120deg in oklch, #36C0FF, #EA80EE, #EF9447, #35D16F);

Tailwind CSS v4

bg-linear-[120deg_in_oklch,#36C0FF,#EA80EE,#EF9447,#35D16F]

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.