Gradient Generator
Create beautiful gradients for your designs. Customize colors, angles, and positions to create the perfect gradient.
Live Preview
Changes are previewed in real-time. Copy the generated CSS code to use in your projects.
Gradient Settings
0%
100%
Preview
background: linear-gradient(90deg, #FF0000 0%, #0000FF 100%);
How to use
- Choose between linear or radial gradient
- Adjust the angle for linear gradients
- Add, remove, or modify color stops
- Use the sliders to adjust color positions
- Click "Randomize" for random color combinations
- Copy the generated code in CSS or Tailwind format