Dégradé Fizzy Brass

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

VibrantsArc-en-cielOranges

Étapes

HEXRGBOKLCHPosition
#F9772D rgb(249, 119, 45) oklch(71.2% 0.179 46.2) 0%
#88D352 rgb(136, 211, 82) oklch(79.1% 0.179 134.3) 33%
#00C8F6 rgb(0, 200, 246) oklch(77.2% 0.143 222.3) 67%
#D28FFF rgb(210, 143, 255) oklch(75.9% 0.168 310.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, #F9772D, #88D352, #00C8F6, #D28FFF);
background: linear-gradient(270deg in oklch, #F9772D, #88D352, #00C8F6, #D28FFF);

Tailwind CSS v4

bg-linear-[270deg_in_oklch,#F9772D,#88D352,#00C8F6,#D28FFF]

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.