Dégradé Blazing Golden Hour

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

Coucher de soleilVibrantsViolets

Étapes

HEXRGBOKLCHPosition
#1E2277 rgb(30, 34, 119) oklch(31.4% 0.141 272.8) 0%
#520982 rgb(82, 9, 130) oklch(35.4% 0.175 305.1) 33%
#B54789 rgb(181, 71, 137) oklch(56.5% 0.16 346.4) 67%
#ECE366 rgb(236, 227, 102) oklch(89.9% 0.146 105.1) 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, #1E2277, #520982, #B54789, #ECE366);
background: linear-gradient(225deg in oklch, #1E2277, #520982, #B54789, #ECE366);

Tailwind CSS v4

bg-linear-[225deg_in_oklch,#1E2277,#520982,#B54789,#ECE366]

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.