Free tool

CSS Gradient Generator

Design linear and radial gradients with a live preview, adjust the angle and stops, then copy clean CSS in one click.

Color 1
Color 2
Angle135°
CSS
background: linear-gradient(135deg, #2D6BB0, #D2854E);

FAQ

Does it support radial gradients?

Yes — toggle between linear and radial. For linear gradients you can also set the angle with the slider.

Is the CSS production-ready?

Yes. The copied value is standard CSS you can paste straight into a background property or a Tailwind arbitrary value.

Now design the whole app.

Bender turns a prompt into a full set of themed mobile screens you can edit, test, and export. Free to start — no credit card.

Try Bender free