随机颜色生成器

随机颜色从哪些数值范围产生

本工具先为每个色块生成一组 HSL 数值，再把同一颜色换算成 HEX、RGB 和 HSV。色相 H 来自所选色调范围，饱和度 S 始终从 40%–100% 的整数中抽取，明度 L 则由“明亮、正常、暗色”决定。每个色块独立生成，因此适合快速取得候选色，而不是按固定种子重现一套颜色。

这些色相名称是本工具采用的筛选区间，并非对整个色轮的唯一命名。例如红色与橙色都可能抽到边界 30°，而“随机”才覆盖完整色相环。

四种代码描述的是同一个色块

格式选项只决定色块悬停时显示、点击时复制哪一种写法，不会另生成一组颜色。HEX 是六位 sRGB 十六进制代码；RGB 把红、绿、蓝写成 0–255 的整数；HSL 保留本次抽取的色相、饱和度和明度；HSV 则把同一 sRGB 颜色换算成色相、饱和度和值。输出都不包含 Alpha 透明度。

一组可复算的格式示例

如果“蓝色系”与“正常”档恰好抽到 HSL(210, 60%, 50%)，工具会显示同色的 #3380cc、rgb(51, 128, 204)、hsl(210, 60%, 50%) 和 hsv(210, 75%, 80%)。RGB 通道和 HSV 百分比会按当前换算结果取整，因此它们是同一色块的不同坐标，不是四次独立随机。

格式、随机性与对比度依据

生成、筛选并复制一批候选色

1. 填写需要的数量

   输入正整数。页面打开时会按默认配置先生成 12 个色块；若要改数量，以输入框旁显示的当前上限为准。一次生成很多色块不利于逐个比较，找灵感时通常先用较小数量更容易筛选。

2. 决定交付格式

   网页样式优先选 HEX、RGB 或 HSL；要把参数带到使用 HSV/HSB 的设计软件时选 HSV。切换格式会立即改变现有色块显示和复制的代码，不需要重新抽取颜色。

3. 收窄色相和明暗

   需要任意结果时选择“随机”；想集中查看橙色、蓝色或冷暖色时选择对应范围。明暗档控制的是 HSL 的 L 区间。修改数量、色调或明暗后，点击“生成”让这些条件应用到新一批色块。

4. 查看并复制单色

   把指针移到色块上可查看当前格式的代码，点击色块即可复制。保留满意的颜色时，应及时粘贴到文档、样式表或设计稿中；再次生成会用新结果替换整组色块。

5. 恢复初始设置

   重置会把数量恢复为 12、格式恢复为 HEX、色调恢复为随机、明暗恢复为正常，并清空当前结果。需要新色块时再点击“生成”。

关于重复、CSS 与配色的常见疑问

随机候选色不是自动配色方案

结果不检查颜色和谐、品牌一致性、色觉辨识度、重复值或前景与背景的对比度。用于正式界面、图表或状态提示前，应结合真实文字、字号、背景和使用环境复核。

• “明亮、正常、暗色”只是 HSL 明度区间。HSL 并非感知均匀色彩空间，相同 L 的黄色与蓝色可能呈现明显不同的视觉明暗。
• 不要只靠颜色区分成功、失败、选中等关键信息；还应配合文字、图标、形状或其他可识别线索。
• 若颜色承载文字，WCAG 2.2 的相关最低要求为普通文本 4.5:1、大号文本 3:1，并存在规范列出的例外。工具不会计算这些比值。

复制、透明度与批量使用边界

• 色块没有透明度分量，复制结果均表示不透明的 sRGB 颜色；需要半透明叠加时，应在目标环境中另行设置 Alpha 并重新检查叠加后的效果。
• 当前操作以单个色块点击复制为主，不会把整批结果自动整理成变量表或文件。再次生成前先保存已选代码。
• 较大的数量会同时显示大量色块。若滚动、悬停或复制响应变慢，可拆成多批生成并及时整理结果。
• 不同屏幕、色彩配置与周围背景会影响实际观感；色块预览不能替代目标设备和最终版式中的检查。