我正在寻找为什么要计算合适的背景颜色和超出顶部的文本颜色,显然我需要考虑可读性和可访问性。
我需要从数组中选择两种颜色,颜色存储在它们的十六进制表示中。
#CC9966
#996633
#FFCC99
#CCCC99
#000000
#333333
#666633
#663333
#CC9933
#FFCCCC
我可以使用像 GD/imageMagick 这样的 PHP 库吗?
任何建议(请注意我使用的是 PHP)
我正在寻找为什么要计算合适的背景颜色和超出顶部的文本颜色,显然我需要考虑可读性和可访问性。
我需要从数组中选择两种颜色,颜色存储在它们的十六进制表示中。
#CC9966
#996633
#FFCC99
#CCCC99
#000000
#333333
#666633
#663333
#CC9933
#FFCCCC
我可以使用像 GD/imageMagick 这样的 PHP 库吗?
任何建议(请注意我使用的是 PHP)
首先,我认为您应该看看Particletree上的这篇出色的博客文章。
话虽如此,我会使用他们的 smarty_modifier_contrast() 函数并对其进行一些修改以满足您的特定需求,例如:
function color_contrast($bgcolor, $color1, $color2, $color3, ...)
{
return (hexdec($bgcolor) > 0xffffff / 2) ? min(array_slice(func_get_args(), 1)) : max(array_slice(func_get_args(), 1));
}
因此,您只需要使用任何随机颜色作为背景(不要忘记删除#
!),然后将所有其他颜色传递给数组,在这种情况下,我使用了可变数量的参数,但您可以更改以便它接受单个颜色数组 - 然后它将根据 自动选择最暗或最亮的颜色,$bgcolor
并提供足够好的对比度以提高可读性:
function color_contrast($bgcolor, $colors = array())
{
return (hexdec($bgcolor) > 0xffffff / 2) ? min($colors) : max($colors);
}
要选择$bgcolor
,您可以像我之前所说的那样随机进行,使用第二个功能来帮助您完成此任务,例如饱和度或亮度,这实际上取决于您要查找的内容。
对于可读性和可访问性而言,选择随机颜色通常不是一个好主意,因此我建议您重新考虑您的设计。或者至少将文本限制为仅黑色或白色。
如果这不是一个选项,那么我建议计算两种颜色之间的“距离”,该距离大约等于颜色之间的视觉差异,因此也与可读性有关。
我会使用distance = abs(2*(r1-r2) + 3*(g1-g2) + (b1-b2))
, 然后过滤掉任何距离不够高的组合。这应该确保您最终在明亮的背景上获得深色,或者在深色背景上获得明亮的颜色,这几乎是良好可读性的先决条件,并确保色盲者也能看到两种明显不同的色调。颜色分量的权重不同,因为它们对总感知亮度有不同的影响。
将每种颜色分解为其 RGB 分量,将 0x80(或其他类似值,可能是 0x66)添加到每个分量,用 0xff 进行掩码,并在表中找到最接近的值。