Build beautiful gradients visually. Copy the CSS code with one click.
CSS gradients let you display smooth transitions between two or more colors as backgrounds. They are generated by the browser, not images, so they scale perfectly at any resolution and are very performant.
There are two main types: linear-gradient() creates color transitions along a straight line at a given angle, while radial-gradient() radiates colors outward from a center point in a circular or elliptical shape.
Color stops define where each color appears along the gradient. You can add multiple stops and position them precisely using percentages to create complex, multi-color effects.