Innotive

CSS Gradient Generator

Generate linear CSS gradients with color stops and angle control. Copy ready-to-use CSS for backgrounds.

Pick two colors and an angle to generate a linear-gradient CSS snippet with live preview. Quickly create hero backgrounds, buttons, and cards without design tools. Runs entirely in-browser.

Angle (deg)

Color 1

Color 2

Stop 1 (%)

Stop 2 (%)

(Coming soon) Easing stops

Live preview

CSS output

How it works