Dégradé Warm Copper

Un dégradé CSS linéaire de 4 couleurs, de #F77EC4 à #00D1D7, interpolé en OKLCH pour que le milieu reste vif.

Arc-en-cielRoses

Étapes

HEXRGBOKLCHPosition
#F77EC4 rgb(247, 126, 196) oklch(75% 0.167 346.1) 0%
#EC862A rgb(236, 134, 42) oklch(71.7% 0.158 56.9) 33%
#A4CC6D rgb(164, 204, 109) oklch(79.5% 0.131 127.8) 67%
#00D1D7 rgb(0, 209, 215) oklch(78.1% 0.133 198.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(90deg, #F77EC4, #EC862A, #A4CC6D, #00D1D7);
background: linear-gradient(90deg in oklch, #F77EC4, #EC862A, #A4CC6D, #00D1D7);

Tailwind CSS v4

bg-linear-[90deg_in_oklch,#F77EC4,#EC862A,#A4CC6D,#00D1D7]

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.