user-interface - 以编程方式淡化颜色

Question

动机

我想找到一种方法来采用任意颜色并将其调亮一些色调，以便我可以以编程方式创建从一种颜色到较浅版本的漂亮渐变。渐变将用作 UI 中的背景。

可能性1

显然我可以将 RGB 值分开并单独增加一定的量。这真的是我想要的吗？

可能性2

我的第二个想法是将 RGB 转换为 HSV/HSB/HSL(色相、饱和度、明度/亮度/明度)，增加一点亮度，降低一点饱和度，然后将其转换回 RGB。一般来说，这会达到预期的效果吗？

Answer 1

如Wedge said ，您想要相乘以使事物变得更亮，但这只能在其中一种颜色变得饱和(即达到 255 或更高)时有效。此时，您可以将值限制为 255，但随着颜色变浅，您将巧妙地改变色调。为了保持色调，您需要保持(中最低)/(最高-最低)的比率。

这是 Python 中的两个函数。第一个实现了简单的方法，如果 RGB 值超出，则将其限制为 255。第二个重新分配多余的值以保持色调完整。

def clamp_rgb(r, g, b):
    return min(255, int(r)), min(255, int(g)), min(255, int(b))

def redistribute_rgb(r, g, b):
    threshold = 255.999
    m = max(r, g, b)
    if m <= threshold:
        return int(r), int(g), int(b)
    total = r + g + b
    if total >= 3 * threshold:
        return int(threshold), int(threshold), int(threshold)
    x = (3 * threshold - total) / (3 * m - total)
    gray = threshold - x * m
    return int(gray + x * r), int(gray + x * g), int(gray + x * b)

我创建了一个渐变，从 RGB 值 (224,128,0) 开始，并将其乘以 1.0、1.1、1.2 等，直至 2.0。上半部分是使用clamp_rgb的结果，下半部分是使用redistribute_rgb的结果。我认为很容易看出，重新分配溢出可以提供更好的结果，而不必离开 RGB 颜色空间。

为了进行比较，这里是 HLS 和 HSV 颜色空间中的相同渐变，由 Python 的 colorsys 实现模块。仅修改了 L 分量，并对生成的 RGB 值进行了钳位。结果相似，但需要对每个像素进行色彩空间转换。