CSS Gradient Generator

Create beautiful CSS gradients with a live preview. Customize colors, direction, and type, then copy the CSS.

Gradient Type

Angle: 135°

Color Stops

#8B5CF60%

#3B82F6100%

Preset Gradients

Generated CSSVendor prefixes

background: linear-gradient(135deg, #8b5cf6 0%, #3b82f6 100%);

Free CSS Gradient Generator

Create stunning CSS gradients for your web projects. Choose between linear and radial gradients, add up to 5 color stops, adjust angles and positions, and copy the generated CSS code instantly. Pick from beautiful presets or build your own custom gradient. No signup required.

Related Tools

Share this tool