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

我试图找到一种方法来确定是否使用黑色或白色文本,给定背景颜色(作为十六进制值)。 有没有人处理过这个? 有没有一种有效的方法来做到这一点?

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


看看这个页面:使用PHP计算颜色对比度

请记住,如果黑人和白人是你唯一的选择,你肯定会遇到这样的情况,他们都不是特别好。


我认为最好的方法是Luminosity Contrast算法

建议:接下来的功能在大多数情况下都能正常工作,但有时会出现颜色无法正常工作。

public function getContrastColor($hexColor) {

        //////////// hexColor RGB
        $R1 = hexdec(substr($hexColor, 0, 2));
        $G1 = hexdec(substr($hexColor, 2, 2));
        $B1 = hexdec(substr($hexColor, 4, 2));

        //////////// Black RGB
        $blackColor = "#000000";
        $R2BlackColor = hexdec(substr($blackColor, 0, 2));
        $G2BlackColor = hexdec(substr($blackColor, 2, 2));
        $B2BlackColor = hexdec(substr($blackColor, 4, 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 'black';
        } else { //////////// if not, return white color.
            return 'white';
        }
}

一些结果:

在这里输入图像描述

注:字体颜色由前一个函数确定。 括号内的数字是对比度。



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

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

  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;
  }
链接地址: http://www.djcxy.com/p/88933.html

上一篇: Given a background color, black or white text?

下一篇: Placeholder padding doesn't work in Firefox