渐变生成器
创建 CSS 渐变并复制代码。
Build a CSS gradient visually: pick linear or radial, set the angle, add as many color stops as you like, and copy the ready-to-paste CSS. Use a preset, roll a random gradient, or fine-tune every stop. Generated locally in your browser.
色标
预设
所有颜色转换均在你的浏览器本地完成 —— 不上传、不存储、不记录。
工作原理
- 1 Choose linear or radial and set the angle.
- 2 Add and position color stops.
- 3 Tweak the colors until you like the preview.
- 4 Copy the CSS, or roll a random one.
常见用例
- Create a hero or button background.
- Make a colorful card or banner.
- Prototype a brand gradient quickly.
- Generate placeholder backgrounds.
常见问题
Is my color data sent anywhere?
No. Every conversion and calculation runs entirely in your browser — nothing is uploaded, stored or logged.
Which gradient types are supported?
Linear (with an angle) and radial. Each supports two or more color stops you can position from 0% to 100%.
Can I use the CSS directly?
Yes. Copy the `background:` declaration and paste it into your stylesheet — it works in all modern browsers.
Is it really free?
Yes — free, with no signup, no watermark and no limits.