Build a linear or radial gradient, preview it live, and copy the CSS. Everything runs in your browser.
background: linear-gradient(...)
Tip: 2-4 stops keep gradients clean. Linear uses the angle; radial blends from the center.
What is a CSS gradient generator? A CSS gradient generator builds the CSS code for a smooth color blend — linear or radial — so you can drop it straight into a stylesheet.
Pick a gradient type (linear or radial), choose 2 to 4 color stops with the color pickers, and for linear gradients set the angle with the slider. The live preview updates instantly and the CSS code is built for you to copy. Everything runs in your browser.
A linear gradient blends colors along a straight line in the direction you set with the angle. A radial gradient blends colors outward from a center point in a circular or elliptical shape. Linear gradients use an angle; radial gradients do not.
Copy the generated code and paste it as the background property of any element in your stylesheet, for example background: linear-gradient(135deg, #6aaa64, #0f3460). The colors and angle you chose are included automatically.