当前位置：文江博客话题详情

如何查看 RGB 颜色是否太浅

发布于 2024-10-27 17:24:09 字数 171 浏览 3 评论 0原文

我有一个应用程序，其中客户选择颜色。我不能让这个颜色太浅。有没有办法看到这一点，防止客户选择太浅的颜色？

非常感谢！

太亮的情况下颜色几乎是白色......我有一个白色背景的网站，用户可以通过 jquery 插件选择颜色。

我想让用户选择他想要的颜色，但不能太浅。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

萌梦深 2024-11-03 17:24:09

如果您正在寻找对比度，那么查看这篇文章。

他们展示了一个类似这样的函数，可以根据任意颜色选择文本颜色：

function isTooLightYIQ(hexcolor){
  var r = parseInt(hexcolor.substr(0,2),16);
  var g = parseInt(hexcolor.substr(2,2),16);
  var b = parseInt(hexcolor.substr(4,2),16);
  var yiq = ((r*299)+(g*587)+(b*114))/1000;
  return yiq >= 128;
}

// usage:
element.style.color = isTooLightYIQ('ff0045') ? '#000' : '#fff';

如果颜色太浅，以至于无法在该颜色之上读取白色文本，则上述函数将返回 true。

If contrast is what you are looking for then check out this article.

They show a function like this to choose text color based on any arbitrary color:

function isTooLightYIQ(hexcolor){
  var r = parseInt(hexcolor.substr(0,2),16);
  var g = parseInt(hexcolor.substr(2,2),16);
  var b = parseInt(hexcolor.substr(4,2),16);
  var yiq = ((r*299)+(g*587)+(b*114))/1000;
  return yiq >= 128;
}

// usage:
element.style.color = isTooLightYIQ('ff0045') ? '#000' : '#fff';

The above function will return true if the color is too light for white text to be readable on top of this color.

回复收藏 0 原文