Design tool
Linear Gradient Maker
Build linear or radial gradients visually, adjust stops, angles and alpha values, then copy ready to use CSS instantly.
Interactive tool
Use Gradient Maker
Usage instructions
How to use this tool
- Choose linear or radial mode.
- Adjust angle, colors, positions and transparency for each stop.
- Copy the generated CSS or download it as a stylesheet snippet.
About this tool
Why people use Linear Gradient Maker
A good gradient maker should let you shape the full gradient quickly without writing CSS by hand. This one keeps the preview and CSS in sync as you edit.