Gradient Generator
Create beautiful CSS gradients with live preview.
Preview
Gradient Settings
Popular Presets
Using CSS Gradients
- Copy the CSS code and apply to
backgroundproperty - Linear gradients flow in a straight line (default: top to bottom)
- Radial gradients radiate from a center point outward
- Use degrees (0-360) to control linear gradient direction
- Supported in all modern browsers
Example: background: linear-gradient(90deg, #15803d, #8b5cf6);