Blazing Indigo Ink gradient

A 2-color linear CSS gradient from #5730B7 to #59AEFF, interpolated in OKLCH so the middle stays vivid.

CoolVibrantTwo-toneBluePurple

Stops

HEXRGBOKLCHPosition
#5730B7 rgb(87, 48, 183) oklch(44.5% 0.198 288.9) 0%
#59AEFF rgb(89, 174, 255) oklch(73.3% 0.144 249.4) 100%

CSS

The first declaration is a plain sRGB gradient for every browser. The second interpolates in OKLCH, which keeps the middle as vivid as the ends.

background: linear-gradient(135deg, #5730B7, #59AEFF);
background: linear-gradient(135deg in oklch, #5730B7, #59AEFF);

Tailwind CSS v4

bg-linear-135/oklch from-[#5730B7] to-[#59AEFF]

Make it your own

Change the stops, angle and type in the Gradient Maker, or turn the stops into a palette.