🌈

CSS Gradient Generator

Build beautiful linear and radial CSS gradients with live preview and instant copy.

Type

Angle: 90°

Color Stops

Presets

Live Preview

Generated CSS

About CSS Gradient Generator

Linear gradients transition colors along a straight line at any angle from 0° to 360°.
Radial gradients emanate from a center point outward in a circular pattern.
Add up to 5 color stops and position each one precisely with a percentage slider.
Click any preset to instantly load a curated gradient combination.
The generated CSS is compatible with all modern browsers — no prefixes needed.