颜色加深工具
通过实时预览，按所选比例降低颜色的亮度. 此工具无需安装，所有处理均在当前浏览器本地完成，不会上传输入内容或本地文件。
开始使用
颜色加深工具的功能
通过实时预览，按所选比例降低颜色的亮度。
示例
输入
#3b82f6；加深20%
结果
更深的蓝色，并更新HEX、RGB和HSL值
颜色计算
根据显示的方法，降低HSL亮度或将通道向黑色混合。
实用工作流程
- 创建设计令牌、图表系列、状态或插画调色板。
- 将复制的颜色值与可见预览和源格式进行比较。
- 使用图像采样在本地匹配现有视觉参考。
可访问性和输出检查
- 调色板和谐并不保证文本对比度可读；请为每个前景/背景组合测试WCAG对比度。
- 显示器、浏览器、色彩配置文件和打印可能会以不同方式呈现相同的数值颜色。
- 来回转换时，四舍五入的转换可能相差一个通道单位。
常见问题解答
为什么转换后的值略有差异？
HEX和RGB使用整数通道，而HSL和HSV通常需要四舍五入的十进制转换。
上传的图像会发送到服务器吗？
除非页面明确说明，否则图像颜色工具会在浏览器中解码和采样支持的图像。
为什么大幅加深会使颜色看起来相似？
当亮度接近零时，通道差异变得不那么明显，所有颜色都趋向于黑色。
深色调整示例与参数说明
例如输入 #60A5FA 并将变暗幅度设为 20%，工具会降低 HSL 亮度，同时尽量保持原有色相与饱和度。结果区会给出可复制的 HEX、RGB 或 HSL 值以及即时色块预览，适合比较按钮悬停态、深色边框和同一品牌色的层级变化。
如何判断结果是否合适
- 先以 5% 至 10% 的小幅度调整，避免暗部细节一次丢失。
- 用于文字或按钮时，应把结果放回实际背景中检查对比度，而不是只比较两个色块。
- 连续生成多个层级时，记录每次使用的百分比，避免设计系统出现无法复现的近似颜色。
常见问题
变暗 20% 等于加入 20% 黑色吗？
不一定。本工具按页面标明的颜色模型调整亮度，和在绘图软件中按透明度叠加黑色可能得到不同结果。
为什么非常深的颜色变化不明显？
接近最低亮度时可用范围已经很小，应降低调整幅度并检查输出数值是否到达边界。
能否直接用于无障碍配色？
颜色变暗不代表自动满足对比度要求。请把最终前景色与背景色交给对比度检查工具再次验证。
此工具无需安装，所有处理均在当前浏览器本地完成，不会上传输入内容或本地文件。