CSS Gradient Generator

Create linear and radial CSS gradients for backgrounds, buttons, and hero sections. Copy the code instantly.

Linear + radialLive previewCopy CSS

Gradient type

Angle (linear only)135deg

Start color

End color

Optional third color

background: linear-gradient(135deg, #667eea, #764ba2);