CSS Gradient Generator

Create CSS linear and radial gradients with a visual editor. Copy ready-to-use CSS with browser prefixes.

Controls
Preview
Preview
CSS Code
/* Select controls above */

Frequently Asked Questions

What is a CSS gradient?

A CSS gradient creates a smooth transition between two or more colors using the background property, without needing an image file.

What is the angle parameter?

The angle controls the direction of a linear gradient. 0deg goes bottom-to-top, 90deg goes left-to-right, 180deg goes top-to-bottom.

Can I use more than two colors?

Yes, CSS gradients support multiple color stops. This generator uses two colors, but you can manually add more to the output.