Colorchord

Gradients that blend true.

40 hand-composed CSS gradients — smooth hue paths, no banding, honest rationale. Click the phrase to wear each one.

Make your own

#8a3a00 · 0%#cc5500 · 50%#f29b4d · 100%
start
middle
end
CSS
background: linear-gradient(135deg, #8a3a00 0%, #cc5500 50%, #f29b4d 100%);
Tailwind
bg-[linear-gradient(135deg,_#8a3a00_0%,_#cc5500_50%,_#f29b4d_100%)]

Two to four stops, evenly spaced. Edit a hex or use the color picker, reorder with the arrows, switch between linear and radial, then copy the CSS or the Tailwind class. Everything happens in your browser.

/