渐变生成器

在线 CSS 渐变生成器,支持线性与径向渐变、双色与角度调节,实时预览并复制 CSS 代码。

纯浏览器本地运行,数据不上传服务器

CSS 代码

使用说明

  1. 选择渐变类型(线性/径向)、调节角度与两个端点颜色,预览实时更新。
  2. CSS 代码同步生成,可一键复制到样式表中。
  3. 适合页面背景、按钮渐变、海报设计等场景。

常见问题

线性与径向渐变有什么区别?
线性渐变沿角度方向过渡;径向渐变从中心圆形向外扩散,适合聚光效果。
可以加多个颜色吗?
本工具为双色渐变,更多颜色可用 CSS 代码手动扩展(复制后自行添加 color-stop)。
生成的代码兼容性如何?
使用标准 linear-gradient / radial-gradient 语法,所有现代浏览器均支持,无需前缀。
反馈