CSS Gradient Generator — Free
Create linear, radial, and conic gradients visually. Add color stops, adjust the angle, and copy the ready-to-use CSS code.
Type
Angle: 135°
Color stops
0%
100%
CSS
background: linear-gradient(135deg, #6366F1 0%, #8B5CF6 100%);
◐
3 gradient types
Linear, radial, and conic gradients. Unlimited color stops.
👁️
Live preview
The gradient preview updates instantly as you adjust colors, positions, or angle.
📋
Ready CSS
The generated CSS is ready to paste directly into your stylesheet. One click to copy.