CSS Gradient Generator
Choose two colours and an angle to get ready-to-use CSS.
- Free
- No signup
- Private: runs in your browser
- Works on mobile
CSS Gradient Generator tool
Loading the tool…
How to use CSS Gradient Generator
- Enter your values in the fields above.
- The result updates instantly as you type or change an option.
- Copy the result or note it down. Nothing is saved on our servers.
Why use DocConvertPRO?
- Free to use with no signup or watermark.
- Everything runs in your browser. Your input is not uploaded.
- Works on phones, tablets and computers.
- Made for Indian users: rupees, lakh/crore formats and local use cases.
About this tool
Copy the generated line into your stylesheet.
Frequently asked questions
Can I add more colours?
Edit the CSS and add colour stops.
Does it work in all browsers?
Yes, modern browsers support gradients.
What angle is top-to-bottom?
180deg.