颜色深浅生成器
输入 HEX 或 RGB 颜色以探索均衡的色阶、比较对比度，并复制可直接使用的颜色值。
试试 #60784b 或 rgb(96, 120, 75)。
更改选择器会同步更新文本值。
选择 3–13 个颜色。
源颜色
#60784B
rgb(96, 120, 75)
使用步骤
如何使用
- 输入 HEX 或 RGB 颜色，或使用取色器选择颜色。
- 查看生成的浅色和深色，以及对比度提示。
- 复制单个 HEX 或 RGB 值、CSS 变量，或将色阶下载为 CSS 文件。
色阶的生成方式
生成器将源颜色向白色混合以生成浅色阶，向黑色混合以生成深色阶。它保持色相方向，但不会假设每种颜色具有相同的感知亮度，因此请始终在实际使用环境中检查结果。
对比度仅供参考
每个色块均使用 WCAG 相对亮度公式报告其与白色和黑色的对比度。4.5:1 是普通文本常见的最低值，3:1 则适用于大号文本；请在界面中核对实际字号、字重、背景和相邻颜色。
本地生成并可导出
解析、色阶生成、复制和 CSS 下载都在浏览器中本地完成。下载文件会在 :root 下包含自定义属性，不会在其他位置包含你的输入。
常见问题
你可能还想知道
接受哪些颜色格式？
可使用六位或三位 HEX，或 rgb(96, 120, 75)、rgb(96 120 75) 这样的 RGB 值。解析器也接受 RGB 分量的百分比。
生成的颜色一定符合无障碍要求吗？
不一定。对比度取决于文本、字号、字重和周围背景。对比率是有用的起点，不代表无障碍审核通过。
颜色会上传吗？
不会。计算和导出完全在浏览器中运行。