更新时间:2023-11-25 23:22:52
您必须分别提取三个 RGB 分量,然后使用标准公式将生成的 RGB 值转换为它们的感知亮度.
You have to extract the three RGB components individually, and then use a standard formula to convert the resulting RGB values into their perceived brightness.
假设有六个字符的颜色:
Assuming a six character colour:
var c = c.substring(1); // strip #
var rgb = parseInt(c, 16); // convert rrggbb to decimal
var r = (rgb >> 16) & 0xff; // extract red
var g = (rgb >> 8) & 0xff; // extract green
var b = (rgb >> 0) & 0xff; // extract blue
var luma = 0.2126 * r + 0.7152 * g + 0.0722 * b; // per ITU-R BT.709
if (luma < 40) {
// pick a different colour
}
编辑
自 2014 年 5 月起,tinycolor
现在具有 getBrightness()
函数,尽管使用的是 CCIR601 加权因子而不是上面的 ITU-R 加权因子.
Since May 2014 tinycolor
now has a getBrightness()
function, albeit using the CCIR601 weighting factors instead of the ITU-R ones above.
编辑
产生的亮度值范围是 0..255,其中 0 是最暗的,255 是最亮的.tinycolor
将大于 128 的值视为浅色.(无耻地从@pau.moreno 和@Alnitak 的评论中复制)
The resulting luma value range is 0..255, where 0 is the darkest and 255 is the lightest. Values greater than 128 are considered light by tinycolor
. (shamelessly copied from the comments by @pau.moreno and @Alnitak)