CSS Gradient Generator
Design a linear gradient visually and copy the CSS in one click.
SponsoredAOS·1AOS-1 MarketplaceDiscover agents, tools & integrations for the Agentic Operating System — by mAIb Tech.Explore the Marketplace →How to use
- Pick your two colors.
- Drag the angle slider to rotate the gradient.
- Copy the generated CSS and paste it into your stylesheet.
Advertisement336 × 280
FAQ
How do I use a CSS gradient?
Paste the generated rule onto any element's background property, e.g. background: linear-gradient(...).
Can I change the direction?
Yes — the angle slider sets the gradient direction in degrees, from 0 to 360.
Advertisement728 × 90