颜色 · 让操作更简单
CSS 渐变生成器
创建含 2–10 个色标的线性或径向 CSS 渐变。调整角度、位置和透明度，使用预设或反转色标，实时预览并复制或下载样式表。
你的工作区在你的设备上处理
支持 2–10 个色标，输出按百分比排序。同位置色标保持列表顺序并形成硬边。透明区域以棋盘背景显示。颜色通道采用 8 位 sRGB，RGBA 输出保留十进制透明度。
三个简单步骤。
- 选择线性或径向，从预设或自定义颜色开始。
- 调整色标颜色与百分比，添加、移除或反转色标。
- 检查预览，再复制 CSS 背景或下载样式表。
使用须知。
支持标准 CSS 颜色名称及数值 HEX/RGB/HSL，位置范围为 0–100%。输出按位置排序，同一位置保留列表顺序，可形成硬边。径向渐变为居中圆形。浏览器插值和显示设备可能不同；不用于印刷色彩处理。
了解隐私保护 →常见问题。
能渐变到透明吗？
可以。使用含 alpha 的颜色，例如 #294C3900 或 rgba(41,76,57,0)。棋盘格显示透明区域。
反转会做什么？
反转色标列表，并把每个位置变为 100 减去原百分比。硬边的颜色顺序也会反转。