asp.net - 评估 HEX 值是暗还是亮

Question

我正在构建的 ASP.NET Web 应用程序的用户可以选择用于某些元素（例如按钮/标题）的颜色，以促进某种程度的个性化。

问题是，默认情况下，这些图层上的文本是黑色的......我要做的是评估用户通过选择器选择的 HEX 值，并以编程方式在黑白文本之间切换 - 这可以在JavaScript，或在代码后面。

问题的症结在于，我只是不确定如何评估 HEX 以决定所选颜色与黑色的接近程度是否太接近而无法使用黑色文本。

有任何想法吗？

Answer 1

不要像其他回答者 (ricknz) 所说的那样将 RGB 分量加在一起，实际上应该取它们的平均值。

此外，由于人眼比蓝色更容易看到绿色，因此您还应该添加权重。

所以你必须先将红色分量乘以 0.299，绿色乘以 0.587，蓝色乘以 0.114

所以亮度由下式给出：亮度 = (r*0.299 + g*0.587 + b*0.114)/3

编辑：这是一个计算它的片段：

 float calcLuminance(int rgb)
 {
      int r = (rgb & 0xff0000) >> 16;
      int g = (rgb & 0xff00) >> 8;
      int b = (rgb & 0xff);

      return (r*0.299f + g*0.587f + b*0.114f) / 256;
 }

ps 除以 256，因为我们 RGB 的范围是 0-256（而不是 0-1）

编辑：将计算更改为除以 256 而不是 768 巧妙地评论

Answer 2

转换为HSL并查看Luminance 值。这会告诉你它有多亮。

这是一个用于进行转换的javascript 函数。

Answer 3

执行此操作的方法现在已内置在 .Net 中：

    var hexcolor = "#FA3CD0";
    var color = System.Drawing.ColorTranslator.FromHtml(hexcolor);
    var brightness = color.GetBrightness();
    if (brightness > .5)
    {
        // color is light
    }
    else
    {
        // color is dark
    }

Answer 4

十六进制颜色代码由三个强度值组成，一个代表红色，一个代表绿色，一个代表蓝色，每个都有 2 个十六进制数字。要确定暗与亮，只需将三个值相加即可。较小的数字会比较大的值更暗。

对于#010203，将 RGB 值相加得到 01+02+03 = 06。这将比 #102030 = 60 更暗。