给定背景颜色的好文本前景色

Question

给定背景颜色的好文本前景色

sho*_*osh 72 user-interface text colors background-color

我正在绘制一个颜色选择按钮,我正在寻找一个漂亮而简单的公式,以获得RGB中给定背景颜色的良好文本颜色(前景).

一个简单的尝试就是采用补色,但这会产生奇怪的按钮,用于纯蓝色或纯红色等颜色.
有没有众所周知的事情呢？

如果它很重要,我正在使用QT.

Answer 1

Mar*_*som 121

为了获得最大的易读性,您需要最大的亮度对比度,而不会陷入无法协同工作的色调.最一致的方法是使用黑色或白色作为文本颜色.你或许可以提出更美观的方案,但它们都不会更清晰.

要在黑色或白色之间进行选择,您需要知道背景的亮度.由于两个因素,这会变得更复杂一些:

红色,绿色和蓝色的原色的感知亮度不相同.我可以给出的最快建议是使用传统公式将RGB转换为灰色 - R*0.299 + G*0.587 + B*0.114.还有很多其他公式.
应用于显示器的伽玛曲线使中间灰度值高于您的预期.这可以通过使用186作为中间值而不是128来轻松解决.任何小于186的内容都应使用白色文本,大于186的任何内容都应使用黑色文本.

请大家注意：如果您需要 W3C 合规性，请参阅 http://stackoverflow.com/a/3943023/5987。 (2认同)

Answer 2

Gab*_*ley 11

我不是编程与RGB相关的东西的专家,但从设计师的角度来看,通常最可读的颜色将更轻(如果背景颜色是暗的)或更暗(如果背景颜色是浅的)版本的相同的阴影.

基本上你会得到你的RGB值,如果它们接近0(暗),你可以将它们每个向上推动相同数量的前景色,反之亦然,如果它是浅BG.

为了便于阅读,补色在眼睛上实际上是非常痛苦的.

Answer 3

Joh*_*n K 9

利用大纲来提高易读性

如果用户选择"良好文本颜色(前景)",您打算将其用于易读性目的,则any background colour可以始终生成具有黑色轮廓的白色文本.它可以在任何实心,图案或渐变背景上清晰可辨,从黑到白,以及介于两者之间的任何东西.

在此输入图像描述

即使这不符合你的意图,我认为值得在这里发布,因为我来寻找类似的解决方案.

Answer 4

Dar*_*cks 5

基于 Mark 的响应，这里有一些 Ruby 代码可以完成这项工作

rgbval = "8A23C0".hex
r = rgbval >> 16
g = (rgbval & 65280) >> 8
b = rgbval & 255
brightness = r*0.299 + g*0.587 + b*0.114
return (brightness > 160) ? "#000" : "#fff"

Run Code Online (Sandbox Code Playgroud)

Qt/c++ 等效值：自动亮度 = Brush.redF() * 0.299 + Brush.greenF() * 0.587 + Brush.blueF() * 0.114；Painter.setPen((brightness > 0.6) ? Qt::black : Qt::white); // 文本 (2认同)

归档时间：	16 年，3 月前
查看次数：	47556 次
最近记录：	8 年，8 月前