Dégradé Lazy Indigo Ink

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

FroidsMonochromesBleus

Étapes

HEXRGBOKLCHPosition
#A1E0FF rgb(161, 224, 255) oklch(87.5% 0.077 230) 0%
#0380A7 rgb(3, 128, 167) oklch(56.1% 0.109 228.4) 50%
#003347 rgb(0, 51, 71) oklch(30.1% 0.061 231.2) 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(120deg, #A1E0FF, #0380A7, #003347);
background: linear-gradient(120deg in oklch, #A1E0FF, #0380A7, #003347);

Tailwind CSS v4

bg-linear-120/oklch from-[#A1E0FF] via-[#0380A7] to-[#003347]

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.