基于另一种颜色,如何计算某个特定的颜色?

3
例如,我有一种蓝色: #049cd9rgba(4, 156, 218) 如何计算对应的颜色,例如在这种情况下它将是深蓝色: #004ea0rgba(0, 78, 160)

?

通常我不知道第二个颜色(我想找出来的那个),所以我想找到一种方法,根据第一个颜色获取较暗的颜色。

enter image description here

有没有公式或方法,可以通过某种方式减去两种颜色来生成一个新的颜色?


我发现了将 HEX 转换为 HSL 和将 HSL 转换为 HEX 的函数

function hex_to_hue($hexcode)
{
    $redhex  = substr($hexcode,0,2);
    $greenhex = substr($hexcode,2,2);
    $bluehex = substr($hexcode,4,2);

    // $var_r, $var_g and $var_b are the three decimal fractions to be input to our RGB-to-HSL conversion routine
    $var_r = (hexdec($redhex)) / 255;
    $var_g = (hexdec($greenhex)) / 255;
    $var_b = (hexdec($bluehex)) / 255;

    // Input is $var_r, $var_g and $var_b from above
    // Output is HSL equivalent as $h, $s and $l — these are again expressed as fractions of 1, like the input values

    $var_min = min($var_r,$var_g,$var_b);
    $var_max = max($var_r,$var_g,$var_b);
    $del_max = $var_max - $var_min;

    $l = ($var_max + $var_min) / 2;

    if ($del_max == 0) {
        $h = 0;
        $s = 0;
    } else {
        if ($l < 0.5) {
            $s = $del_max / ($var_max + $var_min);
        } else {
            $s = $del_max / (2 - $var_max - $var_min);
        }
        ;

        $del_r = ((($var_max - $var_r) / 6) + ($del_max / 2)) / $del_max;
        $del_g = ((($var_max - $var_g) / 6) + ($del_max / 2)) / $del_max;
        $del_b = ((($var_max - $var_b) / 6) + ($del_max / 2)) / $del_max;

        if ($var_r == $var_max) {
            $h = $del_b - $del_g;
        } else if ($var_g == $var_max) {
            $h = (1 / 3) + $del_r - $del_b;
        } else if ($var_b == $var_max) {
            $h = (2 / 3) + $del_g - $del_r;
        }
        ;

        if ($h < 0) {
            $h += 1;
        }
        ;

        if ($h > 1) {
            $h -= 1;
        }
        ;
    }
    ;

    return array($h, $s, $l);

    /*
// Calculate the opposite hue, $h2
$h2 = $h + 0.5;
if ($h2 > 1)
{
$h2 -= 1;
};

return array($h2, $s, $l);
*/

}



function hue_to_hex($hue = array())
{
    function hue_2_rgb($v1,$v2,$vh)
    {
        if ($vh < 0) {
            $vh += 1;
        }
        ;

        if ($vh > 1) {
            $vh -= 1;
        }
        ;

        if ((6 * $vh) < 1) {
            return($v1 + ($v2 - $v1) * 6 * $vh);
        }
        ;

        if ((2 * $vh) < 1) {
            return($v2);
        }
        ;

        if ((3 * $vh) < 2) {
            return($v1 + ($v2 - $v1) * ((2 / 3 - $vh) * 6));
        }
        ;

        return($v1);
    }
    ;


    list($h2, $s, $l) = $hue;

    // Input is HSL value of complementary colour, held in $h2, $s, $l as fractions of 1
    // Output is RGB in normal 255 255 255 format, held in $r, $g, $b
    // Hue is converted using function hue_2_rgb, shown at the end of this code

    if ($s == 0) {
        $r = $l * 255;
        $g = $l * 255;
        $b = $l * 255;
    } else {
        if ($l < 0.5) {
            $var_2 = $l * (1 + $s);
        } else {
            $var_2 = ($l + $s) - ($s * $l);
        }
        ;

        $var_1 = 2 * $l - $var_2;
        $r = 255 * hue_2_rgb($var_1,$var_2,$h2 + (1 / 3));
        $g = 255 * hue_2_rgb($var_1,$var_2,$h2);
        $b = 255 * hue_2_rgb($var_1,$var_2,$h2 - (1 / 3));
    }
    ;


    $rhex = sprintf("%02X",round($r));
    $ghex = sprintf("%02X",round($g));
    $bhex = sprintf("%02X",round($b));

    return $rhex.$ghex.$bhex;
}

他们有效是因为我通过来回转换颜色进行了测试。

但是我不知道如何像Photoshop一样更改色相和亮度属性?暗色将是H +13和L -28。

上面的hex_to_hsl函数返回0到1之间的浮点值...


2
你具体是什么意思?“对应颜色”是什么意思? - Pointy
什么定义了相应的颜色?你只是想得到一个更暗的颜色吗? - musefan
是的,差不多这样。 - Alex
1
你需要更清晰地描述你想要的内容,或者提供一个更大的样本集,这样我们才能尝试进行模式匹配。 - zzzzBov
我所能想到的最简单的变暗方法是将RGB值除以2。这样可以保持RGB的比例,但颜色会变暗。但它可能不会与您提供的颜色完全匹配。 - zzzzBov
颜色看起来搭配得很好,但我看不出它们如何“对应”。除了它们都是蓝色之外,这些颜色似乎没有太多关联。 - Mick Sear
5个回答

4

有一些公式可以将RGB颜色转换为HSV(色调,饱和度和明度)。从HSV中,您可以更改任何HSV组件,然后将其转换回RGB。我在网上找到了一些资料并做过这个事情。如果您想要算法的更多细节,请告诉我,我可以为您查找。


你是怎么想到(出于好奇)这个问题是关于RGB和HSV色彩空间之间的相互转换? - Pointy
1
啊,我明白了 - 转换为HSV,减少“V”,然后再转换回去 :-) - Pointy
@Pointy,插值有一定的作用,但你可能会发现它会使它变得更加灰暗...有点像减少HSV的S和V。 - Nathan MacInnes
只需统一减少R、G和B分量并将其限制在0以下。这将降低亮度但保持色调和饱和度。 - Polynomial
是的,虽然在这种情况下OP似乎不太挑剔 :-) - Pointy
显示剩余12条评论

1

#XXXXXX 表示颜色的红、绿、蓝三个分量的十六进制数值,每两个字符从左到右代表一个分量。如果增加这个数值,颜色会变亮;如果减小这个数值,颜色会变暗。


开发者,这种强调其实并不必要。 - Damien Pirsy

1
你需要将RGB值转换为HSL或HSV,然后可以根据需要减少L(亮度)或V(值)组件,然后再转换回RGB。
请参考以下答案中的示例代码: PHP中的RGB到HSV

谢谢,你知道有没有一个可以反转这个的函数吗?hsv-to-rgb? - Alex

1
调整颜色的最简单方法(例如,使其更浅、更深、更亮、更暗等)是将其转换为HSL。有很多在线资源可以将RGB转换为HSL并在PHPJavaScript中进行反向转换。谷歌会找到您想要的所有实现。然后,要减少亮度,请减小L值(乘以0.75或类似值),然后再转换回RGB。

-1
function hex_to_hue($hexcode, $percent) {
        $redhex = substr($hexcode, 0, 2);
        $greenhex = substr($hexcode, 2, 2);
        $bluehex = substr($hexcode, 4, 2);

        // $var_r, $var_g and $var_b are the three decimal fractions to be input to our RGB-to-HSL conversion routine
        $var_r = (hexdec($redhex)) / 255;
        $var_g = (hexdec($greenhex)) / 255;
        $var_b = (hexdec($bluehex)) / 255;

        // Input is $var_r, $var_g and $var_b from above
        // Output is HSL equivalent as $h, $s and $l — these are again expressed as fractions of 1, like the input values

        $var_min = min($var_r, $var_g, $var_b);
        $var_max = max($var_r, $var_g, $var_b);
        $del_max = $var_max - $var_min;

        $l = ($var_max + $var_min) / 2;

        if ($del_max == 0) {
            $h = 0;
            $s = 0;
        } else {
            if ($l < 0.5) {
                $s = $del_max / ($var_max + $var_min);
            } else {
                $s = $del_max / (2 - $var_max - $var_min);
            }
            ;

            $del_r = ((($var_max - $var_r) / 6) + ($del_max / 2)) / $del_max;
            $del_g = ((($var_max - $var_g) / 6) + ($del_max / 2)) / $del_max;
            $del_b = ((($var_max - $var_b) / 6) + ($del_max / 2)) / $del_max;

            if ($var_r == $var_max) {
                $h = $del_b - $del_g;
            } else if ($var_g == $var_max) {
                $h = (1 / 3) + $del_r - $del_b;
            } else if ($var_b == $var_max) {
                $h = (2 / 3) + $del_g - $del_r;
            }
            ;

            if ($h < 0) {
                $h += 1;
            }
            ;

            if ($h > 1) {
                $h -= 1;
            }
            ;
        }
        ;

        //return array($h, $s, $l);
// Calculate the opposite hue, $h2
        $h2 = $h + $percent;
        if ($h2 > 1) {
            $h2 -= 1;
        }

// Calculate the opposite hue, $s2
        $s2 = $s + $percent;
        if ($s2 > 1) {
            $s2 -= 1;
        }

// Calculate the opposite hue, $s2
        $l2 = $l + $percent;
        if ($l2 > 1) {
            $l2 -= 1;
        }
        return array($h2, $s2, $l2);
    }

1
请在您的回答中添加一些细节,以说明它如何回答问题。 - Patrick

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接