渐变色生成器
CSS 渐变色生成器：线性/径向、角度与多色节点可调，一键复制代码。本地生成。
预览
background: linear-gradient(135deg, #0e8a82, #8b5cf6);
渐变设置
类型
角度：135°
颜色节点
推荐配色
关于「渐变色生成器」
手写渐变代码总要反复调试角度和色标？在预览区实时调整，支持多个颜色节点与角度控制，满意后一键复制标准 CSS。
本地处理不上传服务器免费使用
适用场景
- 为按钮或卡片设计渐变背景
- 制作落地页的过渡色背景
- 快速试出好看的配色组合
- 生成设计稿对应的 CSS 代码
使用步骤
- 选择渐变类型与角度
- 调整颜色节点
- 复制 CSS 代码
常见问题
支持几个颜色节点？
最多 8 个色标，每个可独立设置颜色与位置。
能生成径向渐变吗？
支持。切换类型为 radial 即可，角度设置在径向下不生效。
复制的代码兼容性好么？
生成标准 CSS3 渐变语法，现代浏览器均支持。
有预设配色吗？
内置多组精选渐变预设，点击即可套用再微调。