调亮或调暗颜色

选择一个起始颜色,然后用滑块直接调节其 HSL 亮度分量(取值 0 到 100,而非相对百分比),即可将其调亮或调暗。100% 在您的浏览器中本地处理 —— 不会向服务器发送任何数据。

0 = 纯黑,50 = 纯色,100 = 纯白。
结果颜色

工作原理

与简单地掺入白色或黑色不同,调节 HSL 模型的亮度(L)会完整保留原有的色相(H)和饱和度(S):在整个滑块范围内,颜色始终保持其色彩特征,从纯黑(L=0)到纯白(L=100),中间(L=50)则是纯色。大多数专业取色器正是用这种方法来生成同一色相的协调色阶。

为什么这个滑块不显示调亮的百分比?

相对百分比(「亮度 +20%」)取决于起始值,在接近两端时很容易产生歧义。这里的滑块直接设定 HSL 空间中 L 的绝对值(0 到 100),因此无论起始颜色是什么,结果都可预测、可复现。

色相(H)和饱和度(S)也会改变吗?

不会,只有亮度会被修改。如果您想要更鲜艳或更柔和的颜色,请先通过取色器更换起始颜色,它会重新确定色相和饱和度,然后再调节亮度。

任何数据都不会离开您的设备:HSL 计算完全在您的浏览器中通过 JavaScript 执行。