CSS Gradient Generator

Design stunning Linear, Radial, and Conic CSS gradients. Customize angles and multi-stop colors with real-time CSS code output.

Active Gradient Previewlinear-gradient(135deg, #8B5CF6 0%, #EC4899 50%, #F43F5E 100%)
Angle / Rotation135°

Color Stops (3/6)

0%
50%
100%
Curated Presets
CSS Code Output
/* Standard CSS Property */
background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 50%, #F43F5E 100%);
/* Inline Style Object (React) */
background: 'linear-gradient(135deg, #8B5CF6 0%, #EC4899 50%, #F43F5E 100%)'