🍋 CSS Tools
CSS Gradient Generator
chars
words
sentences
lines
Gradient Options
Results
Result
About CSS Gradient Generator
Generate beautiful CSS gradients with 16 presets — linear, radial, and conic with vendor prefixes and Tailwind output.
How It Works
Choose a gradient type (linear, radial, conic), pick from 16 curated color presets or generate random colors, and configure direction or shape. Outputs standard CSS with fallback color, vendor-prefixed versions, and Tailwind arbitrary value syntax.
Frequently Asked Questions
What gradient types are supported?
Linear (directional), radial (circular/elliptical), and conic (angular sweep). Each supports all 16 color presets plus random generation.
Do I need vendor prefixes?
Modern browsers support unprefixed gradients, but the output includes -webkit- and -moz- prefixes for maximum compatibility.