Toggle navigation
52tool
我爱工具网
首页
常用工具
模板
Markdown
游戏
合作
更多
🏆 工具榜单
海报工具
生活灵感
博客
我的收藏 / 最近浏览
0
关于本站
👤 登录
账号
👤 我的
⭐ 我的收藏
退出登录
🌙
首页
开发工具
CSS 渐变生成器
CSS渐变生成器
渐变类型
Linear (线性渐变)
Radial (径向渐变)
Conic (锥形渐变)
角度:
90
°
形状
Circle (圆形)
Ellipse (椭圆)
位置
Center
Top
Bottom
Left
Right
Top Left
Top Right
Bottom Left
Bottom Right
颜色节点
0%
100%
添加颜色节点
预览
生成的 CSS 代码
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
复制 CSS
预设渐变
💡 这个位置等你来 —
软广告位
/
友情链接
/
合作开发
正在开放中
查看价格
📘 使用说明
拖动滑块调整角度 / 类型(linear / radial)
添加 / 删除色标,每个色标可独立设置位置 % 与颜色
底部代码框输出 CSS,可一键复制到样式表
❓ 常见问题
Q: 支持 conic-gradient 吗?
A: 支持。切换到「conic」模式后可调整起始角度,常用于环形进度 / 仪表盘背景。
Q: 能导出兼容旧浏览器的代码吗?
A: 可以。勾选「带 -webkit- 前缀」会同时输出 webkit / 标准两种语法。
🔗 相关工具
CSS 阴影
👉 下一步
🏆 看看周榜热门
🧩 工作流中心
🔍 全部工具分类
🏠
首页
⚡
测评
🎮
玩耍
📄
模板
💬
合作
💬
30 分钟帮你定稿
×