给定背景颜色,黑色或白色文字?

时间:2009-08-25 23:36:11

标签: php css colors hex

我正在尝试找到一种方法,用于确定是否使用黑色或白色文本,给定背景颜色(作为十六进制值)。以前有人处理过这个吗?有没有一种有效的方法呢?

在我的情况下,我将使用PHP来实现逻辑(尽管欢迎使用其他语言的任何经验)。

7 个答案:

答案 0 :(得分:36)

请看这个页面:Calculating Color Contrast with PHP

请记住,如果黑色和白色是您唯一的选择,那么您必然会遇到两种情况都不是特别好的情况。

答案 1 :(得分:17)

我认为最佳方式是Luminosity Contrast算法

function getContrastColor($hexColor) {

        // hexColor RGB
        $R1 = hexdec(substr($hexColor, 1, 2));
        $G1 = hexdec(substr($hexColor, 3, 2));
        $B1 = hexdec(substr($hexColor, 5, 2));

        // Black RGB
        $blackColor = "#000000";
        $R2BlackColor = hexdec(substr($blackColor, 1, 2));
        $G2BlackColor = hexdec(substr($blackColor, 3, 2));
        $B2BlackColor = hexdec(substr($blackColor, 5, 2));

         // Calc contrast ratio
         $L1 = 0.2126 * pow($R1 / 255, 2.2) +
               0.7152 * pow($G1 / 255, 2.2) +
               0.0722 * pow($B1 / 255, 2.2);

        $L2 = 0.2126 * pow($R2BlackColor / 255, 2.2) +
              0.7152 * pow($G2BlackColor / 255, 2.2) +
              0.0722 * pow($B2BlackColor / 255, 2.2);

        $contrastRatio = 0;
        if ($L1 > $L2) {
            $contrastRatio = (int)(($L1 + 0.05) / ($L2 + 0.05));
        } else {
            $contrastRatio = (int)(($L2 + 0.05) / ($L1 + 0.05));
        }

        // If contrast is more than 5, return black color
        if ($contrastRatio > 5) {
            return '#000000';
        } else { 
            // if not, return white color.
            return '#FFFFFF';
        }
}

// Will return '#FFFFFF'
echo getContrastColor('#FF0000');

一些结果:

enter image description here

  

注意: 字体颜色由上一个功能决定。括号中的数字是对比度。


另一种最简单且不太精确的方式称为YIQ因为它将RGB颜色空间转换为YIQ ):

public function getContrastColor($hexcolor) {               
    $r = hexdec(substr($hexcolor, 1, 2));
    $g = hexdec(substr($hexcolor, 3, 2));
    $b = hexdec(substr($hexcolor, 5, 2));
    $yiq = (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
    return ($yiq >= 128) ? 'black' : 'white';
}                   

答案 2 :(得分:6)

  function getTextColour($hex){
    list($red, $green, $blue) = sscanf($hex, "#%02x%02x%02x");
    $luma = ($red + $green + $blue)/3;

    if ($luma < 128){
      $textcolour = "white";
    }else{
      $textcolour = "black";
    }
    return $textcolour;
  }

答案 3 :(得分:2)

这是一种可用于计算文本亮度对比度的算法:

http://juicystudio.com/services/aertcolourcontrast.php

您可以使用此公式计算白色和黑色值,从而为您提供更高的比率,从而提供更易读的文本。

答案 4 :(得分:2)

你应该看看the CSS Color library。它是用PHP实现的,并为您完成所有艰苦的工作。

答案 5 :(得分:1)

一个简单但不完美的解决方案是对各个组件(RGB)求和,这个值越大'颜色越亮'。因此,对于较高的值,您可以使用黑色作为前景,而对于较低的值,则使用白色。

然后你可以改进这个方法,为灰度颜色(R = G = B)制作特定的情况,除非是深灰色,否则不能很好地显示白色文字。

编辑这当然意味着您需要知道十六进制值中RGB存储的格式,标准24bpp存储为8个十六进制数字的0x00RRGGBB。

答案 6 :(得分:0)

我会计算rgb组件的平均值,然后决定是使用黑色还是白色,例如:白色高达0x66