CSS Gradient Generator

Create linear or radial CSS gradients, copy CSS and Tailwind snippets, and export PNG gradient backgrounds with exact dimensions.

Use this CSS gradient generator to build linear or radial background gradients with full control over color stops, angle, shape, and export size. Start from a preset palette or build your own, then copy clean CSS or Tailwind classes for immediate use in landing pages, UI components, and design systems. Need a static image? Set the exact output size and download a PNG gradient background.