Dégradé Pale Butter

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

PastelArc-en-cielRougesJaunes

Étapes

HEXRGBOKLCHPosition
#FFBCB1 rgb(255, 188, 177) oklch(85.4% 0.08 29.3) 0%
#DBD689 rgb(219, 214, 137) oklch(86.3% 0.098 105.1) 50%
#A3E7F0 rgb(163, 231, 240) oklch(88.6% 0.069 206.3) 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, #FFBCB1, #DBD689, #A3E7F0);
background: linear-gradient(90deg in oklch, #FFBCB1, #DBD689, #A3E7F0);

Tailwind CSS v4

bg-linear-90/oklch from-[#FFBCB1] via-[#DBD689] to-[#A3E7F0]

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.