我正在寻找一种技术，我们可以通过编程方式选择最佳的颜色对比，以应用于不同（不可预测的）背景颜色的HTML元素上的文本。
由于HTML元素将具有不同的颜色，我们正在寻找一种能够确定文本背后内容的颜色的技术，然后调整文本的颜色以使用具有最佳对比度的颜色。
我很确定这不能只是CSS，我已经找了Jquery解决方案，但找不到任何...有人有线索吗？
[更新]： 根据第一个回复，我想我需要改写。想象一下，我正在建立一个图像共享服务，我想让人们标记 上 图片本身。图片可以是任何颜色。如何为每张不同的图片选择正确的标签颜色？
我认为这可能会为未来的研究人员节省一点时间，这对我来说非常有效。将红色绿色和蓝色值插入到功能中，它会输出“dark-text”或“light-text”。
var darkOrLight = function(red, green, blue) {
var brightness;
brightness = (red * 299) + (green * 587) + (blue * 114);
brightness = brightness / 255000;
// values range from 0 to 1
// anything greater than 0.5 should be bright enough for dark text
if (brightness >= 0.5) {
return "dark-text";
} else {
return "light-text";
}
}
使用一些代码 http://particletree.com/notebook/calculating-color-contrast-for-legible-text/ 来自@ David的回答。
看一眼 http://www.0to255.com 。只需片刻即可看一眼网站呈现的渐变效果。你将不得不拼图，但只有大约20秒。它是解决此类问题的绝佳站点，也是程序化解决方案的绝佳思想来源。并且没有涉及数学：只需为rgb vals插入一些字节即可。
这是我最喜欢的资源 计算“可读性” （对比度）两种颜色。
W3C建议在文本后面的文本和背景之间存在至少5：1的对比度 http://www.w3.org/TR/2007/WD-WCAG20-TECHS-20070517/Overview.html#G18
从页面：
上面显示的合规率是达到的最高合规率。 WCAG 2.0级别AA和建议的508条款刷新合规级别是基于对于大小为18磅（如果用粗体加点为14点）或更大的文本或对于尺寸小于大小的文本为4.5：1的文本实现3：1的对比度。 18分。当小于18点的文本的对比度为7：1，文本18点（如果加粗为14点）或更大的对比度为4.5：1时，符合WCAG 2.0级AAA合规级别。
现在有一个名为的房产 mix-blend-mode 在CSS（目前只是在草稿中），可以用来实现类似于你想要的东西。
.contrasting-text {
mix-blend-mode: difference;
}
CodePen有人一起展示了这个： https://codepen.io/thebabydino/pen/JNWqLL
只需一行即可解决问题：
function getContrast50($hexcolor)
{
return (hexdec($hexcolor) > 0xffffff/2) ? 'white':'black';
}
如果对比度需要反转，只需用黑色打开白色就可以了。在PHP中。