CSS Gradient Generator
Pick colors and an angle, preview the gradient live and copy production-ready CSS. 100% in your browser.
CSS
background: linear-gradient(90deg, #6366f1, #ec4899);Advertisement
About this tool
Build linear or radial CSS gradients with a live preview and copy production-ready code.
Common use cases
- Design a precise background gradient
- Tune colors and angle visually
- Copy gradient CSS into a stylesheet