如何生成颜色的浅色和深色变体

先了解颜色变体生成方式

这个工具可根据输入的颜色生成更浅和更深的颜色变体，适合整理配色、制作界面层级或快速比较同一基色的明暗变化。你可以调整生成步数，并分别决定是否保留浅色组和深色组。未填写颜色时，工具会使用默认颜色 #3498db；未填写步数时，默认生成 10 个步进。

生成颜色明暗变体的步骤

1. 在颜色输入框中填写十六进制颜色，例如 #3498db。如果输入内容没有以 # 开头，工具会在解析前自动补上这个前缀；三位十六进制写法会先展开为六位形式，例如 #abc 按每位重复处理。
2. 设置步数。输入正整数 5 时，每个已选中的变体组都会包含 5 个结果。步数留空时，使用默认值 10。
3. 分别选择是否生成更浅的颜色组和更深的颜色组。两组默认都会纳入结果，也可以只保留其中一组。
4. 执行生成并查看返回结果。检查基色记录、浅色组和深色组是否符合你的配色用途；如果只需要一侧的明暗变化，确认另一组已被省略。

如何阅读结果与判断边界

结果通常包含经过规范化的基色记录，以及按选择生成的浅色组和深色组。输入没有 # 时，基色记录会保留补上前缀后的颜色文本；三位写法则会按重复每个数字的方式参与转换。每个变体组的数量由正整数步数控制，而不是由两组共同分摊。

生成时，颜色通道会先四舍五入为整数，并限制在 0 到 255 的范围内，再转换成十六进制格式。因此，结果适合用于查看和复制颜色值，但不应把步数理解为颜色之间固定的视觉距离。若颜色无法通过工具的解析转换，返回数据会包含错误提示，同时操作状态仍会标记为成功，此时应检查输入格式和内容。

使用示例

设计者想比较蓝色基色的两侧明暗层级，因此使用 #3498db 生成两组各 5 个变体。

输入 #3498db，将步数设为 5，保留浅色组和深色组后执行生成。

结果包含规范化后的基色记录、5 个浅色变体和 5 个深色变体；两组的数量都由步数 5 控制。

使用限制

• 颜色通道会四舍五入并限制在 0 到 255 范围内；无法通过解析转换的颜色会在成功标记下附带错误提示，因此不能仅依据操作状态判断颜色输入有效。

常见错误

• 输入内容无法通过解析转换时，结果可能出现错误提示。请改用可解析的十六进制颜色写法，并检查是否误填了不属于颜色值的字符；缺少开头的 # 本身会由工具补上。

常见问题

支持三位十六进制颜色吗？

可以。输入三位十六进制写法后，工具会重复每个数字再进行转换，例如 #abc 会按三位展开规则处理。

能否只生成浅色或深色？

可以。把步数设为正整数 5 时，每个已纳入的变体组都会包含 5 个结果；只选择浅色组或深色组时，则只返回所选组。

颜色和步数都可以留空吗？

不填写颜色时会使用默认颜色 #3498db；不填写步数时会使用默认值 10。