CSS Gradient Generator

Create beautiful CSS gradients with up to 6 colours, any angle, and copy the CSS or download a PNG background in common sizes. Free generator.

Type

Angle: 135°

0%

100%

background: linear-gradient(135deg, #2c43e5 0%, #e11d48 100%);

How to use CSS Gradient Generator

Choose linear, radial or conic.
Set the angle and the colours (up to 6) and their positions.
Copy the CSS or download a PNG background.

Good to know

Runs in your browser; nothing is uploaded.

Privacy

Runs entirely in your browser. Nothing you enter or open here is uploaded.

Related tools