Free Online Tool
Gradient Maker
Design multi-stop gradients with live preview — copy the CSS or download a PNG.
linear-gradient(135deg, #7C3AED 0%, #EB367F 55%, #50E3C2 100%)
CSS
background: linear-gradient(135deg, #7C3AED 0%, #EB367F 55%, #50E3C2 100%);Color stops (3)
#7C3AED
0%
#EB367F
55%
#50E3C2
100%
Angle135°
From palette to gradient
Tip: extract a palette from any photo with the image color picker, then rebuild its tones here as a reusable gradient. Verify text placed on gradients with the contrast checker.