Dégradé Glowing Guava

Un dégradé CSS linéaire de 2 couleurs, de #F68E2B à #B12990, interpolé en OKLCH pour que le milieu reste vif.

ChaudsVibrantsBicoloresOrangesRoses

Étapes

HEXRGBOKLCHPosition
#F68E2B rgb(246, 142, 43) oklch(74.3% 0.163 58.2) 0%
#B12990 rgb(177, 41, 144) oklch(53.2% 0.2 339.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(0deg, #F68E2B, #B12990);
background: linear-gradient(0deg in oklch, #F68E2B, #B12990);

Tailwind CSS v4

bg-linear-0/oklch from-[#F68E2B] to-[#B12990]

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.