CSS Gradient Generator
Create linear and radial CSS gradients visually — copy code instantly
How to Use the Gradient Generator
Adjust the gradient type, angle, and color stops using the controls. The CSS code updates live. Click "Copy CSS" to copy it to your clipboard and paste it directly into your stylesheet.
CSS gradient syntax
linear-gradient(angle, color1 stop1, color2 stop2)radial-gradient(shape, color1 stop1, color2 stop2)- Supports multiple color stops