已复制

色阶生成器

基于基础颜色一键生成深浅渐变序列,点击色块复制 hex 值

计算转换

颜色设置

快速选择:

色阶结果

选择颜色并点击"生成色阶"查看结果

使用说明
基础颜色选择

通过取色器十六进制输入快速颜色按钮选择基础颜色。色阶生成器将以此为基准,向深色和浅色两个方向生成渐变序列,也可使用 颜色转换 工具。

变暗/变亮步数

分别控制向深色方向浅色方向生成的色阶数量。每步逐渐变暗(混合黑色)或变亮(混合白色),生成均匀的色阶过渡,可配合 颜色混合 工具一起使用。

色块操作

点击任意色块即可复制该色块的 hex 值到剪贴板。顶部"复制全部 hex"按钮可一键复制所有色阶的十六进制值列表,也可使用 颜色测试 工具。

应用场景

适用于 Tailwind CSS 调色板扩展、设计系统色阶定义、CSS 变量配色、图表配色方案生成等场景。生成的色阶也可用于代码中的颜色渐变计算。