Summer Golden Hour gradient

A 3-color linear CSS gradient from #2A0E8E to #F0E162, interpolated in OKLCH so the middle stays vivid.

SunsetRainbowYellowPurple

Stops

HEXRGBOKLCHPosition
#2A0E8E rgb(42, 14, 142) oklch(32.4% 0.185 278.4) 0%
#A1609B rgb(161, 96, 155) oklch(58.2% 0.115 330.3) 50%
#F0E162 rgb(240, 225, 98) oklch(89.8% 0.147 102.6) 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(180deg, #2A0E8E, #A1609B, #F0E162);
background: linear-gradient(180deg in oklch, #2A0E8E, #A1609B, #F0E162);

Tailwind CSS v4

bg-linear-180/oklch from-[#2A0E8E] via-[#A1609B] to-[#F0E162]

Make it your own

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