CSS gradient generator

Create stunning gradient backgrounds effortlessly with our free CSS Gradient Generator. Customize colors, direction, and style for your designs.

Preset gradients

Start color

End color

Use mid color

Linear

Radial

Angle

0°

Reverse

background: #474bff;
background: -webkit-linear-gradient(0deg, #474bff 0%, #bc48ff 100%);
background: linear-gradient(0deg, #474bff 0%, #bc48ff 100%);