CSS Gradient Generator

Linear, radial and conic gradients with up to 5 stops. Copy the CSS or a Tailwind arbitrary-value class.

background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);

bg-[linear-gradient(135deg,#6366f1_0%,#ec4899_100%)]

Presets

Runs locally. Stops are sorted by position in the generated CSS; the Tailwind class uses arbitrary-value syntax with underscores in place of spaces.