Dégradé Cozy Sandbar

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

OcéanVerts

Étapes

HEXRGBOKLCHPosition
#E4D99A rgb(228, 217, 154) oklch(87.9% 0.082 99.4) 0%
#8CAD64 rgb(140, 173, 100) oklch(70.6% 0.106 128.7) 33%
#008059 rgb(0, 128, 89) oklch(53.1% 0.114 163.4) 67%
#004049 rgb(0, 64, 73) oklch(34% 0.059 210.4) 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(225deg, #E4D99A, #8CAD64, #008059, #004049);
background: linear-gradient(225deg in oklch, #E4D99A, #8CAD64, #008059, #004049);

Tailwind CSS v4

bg-linear-[225deg_in_oklch,#E4D99A,#8CAD64,#008059,#004049]

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.