🎨

CSS Gradient Generator

Design linear and radial CSS gradients and copy the ready-to-use code.

background: linear-gradient(90deg, #22d3ee, #8b5cf6);

Build your CSS gradient and paste the code straight into your project.

About this tool

Adjust colors, angle, and gradient type to build a CSS gradient with live preview. Add multiple color stops, randomize, and copy the ready `background` code with one click.

Key Features

  • ✓ Linear & radial
  • ✓ Multiple color stops
  • ✓ Live preview
  • ✓ Copyable CSS code