Easy Kumquat gradient

A 2-color linear CSS gradient from #D2B287 to #4A2400, interpolated in OKLCH so the middle stays vivid.

WarmEarthyMonochromeOrange

Stops

HEXRGBOKLCHPosition
#D2B287 rgb(210, 178, 135) oklch(78.1% 0.068 74.7) 0%
#4A2400 rgb(74, 36, 0) oklch(30.6% 0.074 57.8) 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(45deg, #D2B287, #4A2400);
background: linear-gradient(45deg in oklch, #D2B287, #4A2400);

Tailwind CSS v4

bg-linear-45/oklch from-[#D2B287] to-[#4A2400]

Make it your own

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