TToolsHub

Gradient Generator

Build beautiful CSS gradients with 2–3 color stops, a live preview, and copy-ready code.

Color stops
Live preview
CSS

How to use

  1. Add up to 3 color stops — set each color and its position along the gradient.
  2. Choose linear or radial, and drag the angle slider for linear gradients.
  3. Copy the generated CSS and paste it into your stylesheet.

Privacy note: everything runs in your browser — nothing is uploaded or stored.