首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在RGB和HSB颜色值之间切换的算法

是通过将RGB颜色空间的红、绿、蓝三个分量转换为HSB颜色空间的色调、饱和度和亮度三个分量,或者将HSB颜色空间的色调、饱和度和亮度三个分量转换为RGB颜色空间的红、绿、蓝三个分量。

RGB颜色空间是通过红、绿、蓝三个分量的不同强度来表示颜色的,每个分量的取值范围是0到255。HSB颜色空间是通过色调、饱和度和亮度三个分量来表示颜色的,色调的取值范围是0到360度,饱和度和亮度的取值范围是0到100。

下面是一个简单的RGB到HSB的转换算法:

  1. 将RGB颜色空间的红、绿、蓝三个分量的取值除以255,得到它们的百分比值。
  2. 计算最大值和最小值:max = max(红, 绿, 蓝),min = min(红, 绿, 蓝)。
  3. 计算亮度:亮度 = (max + min) / 2。
  4. 如果最大值和最小值相等,说明颜色是灰色,色调和饱和度都为0。
  5. 如果最大值和最小值不相等,根据最大值的位置计算色调和饱和度:
    • 如果最大值在红色分量上,色调 = (绿 - 蓝) / (max - min) * 60。
    • 如果最大值在绿色分量上,色调 = 120 + (蓝 - 红) / (max - min) * 60。
    • 如果最大值在蓝色分量上,色调 = 240 + (红 - 绿) / (max - min) * 60。
    • 如果色调小于0,色调 = 色调 + 360。
    • 饱和度 = (max - min) / max * 100。

下面是一个简单的HSB到RGB的转换算法:

  1. 将HSB颜色空间的色调、饱和度和亮度三个分量的取值除以100,得到它们的百分比值。
  2. 如果饱和度为0,说明颜色是灰色,红、绿、蓝三个分量都为亮度的值乘以255。
  3. 如果饱和度不为0,根据色调的值计算红、绿、蓝三个分量:
    • 色调的取值范围是0到360度,将其转换为0到6的整数。
    • 将亮度的值乘以(1 - 饱和度)得到最小值。
    • 计算色调在0到6之间的整数部分和小数部分。
    • 根据色调的整数部分选择红、绿、蓝三个分量的值:
      • 如果色调为0,红 = 亮度,绿 = 亮度 × (1 + 饱和度 × (色调 - 整数部分)),蓝 = 亮度 × (1 - 饱和度)。
      • 如果色调为1,红 = 亮度 × (1 - 饱和度 × (色调 - 整数部分)),绿 = 亮度,蓝 = 亮度 × (1 - 饱和度)。
      • 如果色调为2,红 = 亮度 × (1 - 饱和度),绿 = 亮度,蓝 = 亮度 × (1 + 饱和度 × (色调 - 整数部分))。
      • 如果色调为3,红 = 亮度 × (1 - 饱和度),绿 = 亮度 × (1 - 饱和度 × (色调 - 整数部分)),蓝 = 亮度。
      • 如果色调为4,红 = 亮度 × (1 + 饱和度 × (色调 - 整数部分)),绿 = 亮度 × (1 - 饱和度),蓝 = 亮度。
      • 如果色调为5,红 = 亮度,绿 = 亮度 × (1 - 饱和度),蓝 = 亮度 × (1 - 饱和度 × (色调 - 整数部分))。
  4. 将红、绿、蓝三个分量的值乘以255,得到它们的取值范围是0到255。

这个算法可以用于在RGB和HSB颜色值之间进行转换,方便在不同的颜色表示方式之间进行切换和计算。对于具体的应用场景和推荐的腾讯云相关产品和产品介绍链接地址,可以根据实际需求和具体情况进行选择和参考。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

颜色空间系列3: RGBYCbCr颜色空间转换及优化算法

颜色空间系列代码下载链接:http://files.cnblogs.com/Imageshop/ImageInfo.rar (同文章同步更新) 常用几种颜色空间中,YCbCr颜色空间在学术论文中出现频率是相当高...其RGB空间之间相互转换公式在网上也有多种,我们这里取http://en.wikipedia.org/wiki/YCbCr 描述JPG转换时使用计算公式:   JPEG conversion   ...上述公式主要优点是转换后各分量范围也0到255之间,因此用 byte类型变量即可容纳新颜色空间。...要避免浮点运算带来速度瓶颈,这里同样可以用 颜色空间系列1: RGBCIEXYZ颜色空间转换及相关优化 文章中同样优化技巧。...空间所有颜色,无颜色存在溢出 *To = (byte)((YCbCrYRI * Red + YCbCrYGI * Green + YCbCrYBI * Blue +

1.5K30

颜色空间系列2: RGBCIELAB颜色空间转换及优化算法

关于CIELAB颜色空间更多原理说明,可见:http://en.wikipedia.org/wiki/Lab_color_space 本文研究重点是RGBLAB之间快速转换过程。...首先,RGBLAB之间没有直接转换公式,其必须用通道XYZ颜色空间作为中间层,关于RGBXYZ颜色空间转换及优化,详见颜色空间系列1。...即使这样映射后,一般来说,LAB各分量结果仍为浮点数,这个RGB不同,但是很多情况下,为了速度计效率,我们这需结果取整部分,得到类似于RGB空间布局。...关于这样优化,OpenCv已经做了非常好工作,各位看客也可以先看看OpenCv代码,本文未直接沿用其优化,但本文算法更简单明了,保证结果无明显变化同时,速度效率都有30%以上提升。...颜色空间系列1文章中,我们知道,转换后XYZ值得范围是[0,255],而这里t范围为[0,1],把if t>(6/29)^3这个算法映射到[0,255],则为 if t>2.26 ,因为XYZ都为整数

3.1K20

学会HSB色彩模式,让配色有理有据!

RGB CMYK 两大色彩模式是最重要和最基础RGB 更是与我们工作密不可分。可是,实际工作中我们往往很少直接通过 RGB 模式进行调色。 ---- ????...HSB 模式对应媒介是人眼,选择色彩这件事上,HSB 使用了更贴近人类感官直觉方式来描述色彩,它把颜色分为色相、饱和度、明度三个因素(将我们人脑“深浅”概念扩展为饱和度明度)。...H—色相/色调:颜色相貌,颜色调性,标准色轮上,色相是按位置度量,取值0—360度之间(黑色与白色无色相)。...△ 网络图片-圆形色相环 S—表示饱和度/纯度:颜色纯度,取值0—100之间,饱和度高色彩较艳丽。饱和度低色彩就接近灰色。 B—表示明度/亮度:颜色明暗程度。取值也是0—100之间。...系统统一从头部氛围图吸取、确定颜色后,通过调整饱和度明度(色不变),即可得到一套色卡。 △ vivo游戏中心预约详情页设计规范 2.

1.4K30

VB.NET 实现屏幕取色器20210924

VB.NET 实现屏幕取色器 一,先看看效果图 二,开始前,我们先来简单(毕竟复杂咱也不会)了解一下,颜色各种表达方式和他们之间转换吧!(以下内容来自网络) 2.1.什么是RGB模式?  ...RGB色彩模式是工业界一种颜色标准,是通过对红(R)、绿(G)、蓝(B)三个颜色通道变化以及它们相互之间叠加来得到各式各样颜色RGB即是代表红、绿、蓝三个通道颜色,这个标准几乎包括了人类视力所能感知所有颜色...它RGB相比最大不同是,RGB模式是发光色彩模式,你一间黑暗房间内仍然可以看见萤幕上内容。  CMYK是一种依靠反光色彩模式,我们能阅读报纸内容是为什么呢?...这个模型中颜色参数分别是:色调(H),饱和度(S),明度(V)。 三,再简单了解一下,各颜色模式之间转换公式VB代码吧!...模式公式 R,G,B0..255范围内给出。

1.9K80

用这个小程序,给甲方一点「颜色」瞧瞧

「配色广场」中,就提供了许多「Adobe Color 配色方案」,一页 5 组,一组 5 种颜色。页面底部有个「Surprise me」按键,点击它,就切换另外 5 组。...如果你有一个确定主色调,就可以在这里挑选可与之搭配颜色。 ? 看见喜欢方案,点进去,就能获得这个色彩方案「配色详情」,详细展示了每一种颜色 RGB HSB。...首先,你要确定一种颜色模式,页面上方「模式选择」有 RGB、CMYK、LAB、HSB 四种可选。选好模式,每一个属性有相应滑块,滑动它就可以调整色值了。...如果你对这几种配色算法没有概念,也没关系,「关于 Color 颜」中可以找到详细介绍,顺便还能涨涨知识呢。 ?...每一种配色算法都需要一个「主色」或「基准色」,这个由你自己来调它 RGB 以及饱和度、亮度,然后小程序会根据你选择配色算法推荐一组 4 种颜色

47220

使用HSB而不是RGB来定义颜色

有多种方法可以代码中定义颜色。最常用方法是指定三种基色 - 红色、绿色蓝色 (RGB)。本文通过指定色调、饱和度亮度 (HSB) 来探索替代机制使用。...每个属性可以是 0 到 255 之间十进制,但通常以十六进制格式给出,因此颜色可以用 6 个字符表示。 Mac 上 数码测色计 可用于检查屏幕上任何区域并给出所选颜色 RGB 。...调色板(红色、绿色蓝色) HSB 颜色(色调、饱和度 & 亮度) HSB 颜色模型被认为更符合我们对颜色看法。...请注意,色相(Hue) 通常被赋予一个以角度为单位,表示色环周围角度, 0 到 360 之间,SwiftUI 使用 0.0 到 1.0 之间,其中 1.0 表示 360 度。...HSB(色调、饱和度亮度)不同调色板 具有不同 HSB(色相、饱和度亮度)调色板 - 较低亮度往往很暗 色调、饱和度亮度 色调:通过彩虹颜色代表从红色到紫色基色。

2.6K30

Qt编写自定义控件28-颜色滑块面板

一、前言 相比于上一个颜色按钮面板,此控件就要难很多,颜色有三种表示形式,除了程序员最常用RGB以外,还有HSBCMY方式。...RGB色彩模式是工业界一种颜色标准,是通过对红(R)、绿(G)、蓝(B)三个颜色通道变化以及它们相互之间叠加来得到各式各样颜色RGB即是代表红、绿、蓝三个通道颜色,这个标准几乎包括了人类视力所能感知所有颜色...HSB又称HSV,表示一种颜色模式:HSB模式中,H(hues)表示色相,S(saturation)表示饱和度,B(brightness)表示亮度HSB模式对应媒介是人眼。...HSB模式中SB呈现数值越高,饱和度明度越高,页面色彩强烈艳丽,对视觉刺激是迅速,醒目的效果,但不益于长时间观看。...由于本控件用于灯光舞台效果控制控件,可能用户不一定相关使用RGB颜色,也可能用到HSB或者CMY,所以提供颜色选择时候,三种都要提供,一种处于选中调节模式情况下,另外两种要跟随变化,这个是难点,

1.3K30

UGL之颜色处理

计算机里通常使用RGB色彩模式,例如RGB565,就是用两个字节表示一个像素颜色,其中红绿蓝分别用5、6、5个bit。还有一些RGB555、RGB666、ARGB4444之类。...不过,只把RGB两两混合画出来,还是比较容易 而Windows"画图"中,除了RGB,还有一种ESL模式 这个ESL与HSL/HSB含义差不多,而与RGB之间也仅是一个简单转换关系。...写个函数很容易实现它们之间转换 Red 红色 Green 绿色 Blue 蓝色 HSL/ESL H/E: Hue...Luminance 客观测量发光体亮度 既然有了RGB到ESL转换,那很容易就可以实现调整饱和度亮度函数了 例如下面的右图是将左图ESL中饱和度调整为最大,颜色显得更鲜艳...基本规则是: 提高对比度,就是让亮更亮,暗更暗 降低对比度,就是所有颜色RGB向中间靠拢 有点意思 我是泰山,专注VX 17年! 一起学习,共同进步!

95730

分享一个算法,计算能在任何背景色上清晰显示前景色

---- 灰度图心理学公式 红绿蓝三色是非常不直观颜色表示方法,如果不经过训练,人类几乎没有办法直接通过 RGB 来猜出大概颜色来。...而 HSB 是用来解决人眼感知问题,它将颜色用色相、饱和度、明度来表示。 可是,即便是 HSB 也不能完美解决人眼感知问题。...所以,饱和度明度之外,一定还有一种人眼对亮度感觉是与色相相关。 我们将不同色相颜色排成一圈,观察下哪些颜色更亮,哪些更暗: ?...也就是说,不同颜色总能找到一个人眼感知灰度,这是著名心理学公式: 灰度 = 红×0.299 + 绿×0.587 + 蓝×0.114 灰度背景色上决定前景色 一个图像每一个像素经过上面的公式计算得到图像...包含亮度灰度反色逻辑 DependencyMarkupExtension 给标记扩展中一些恶心代码提供封装 ---- 参考资料 Luma (video) - Wikipedia 从RGB色转为灰度色算法

1.1K10

基于CC++HSV转RGB程序

介绍 HSV HSV是根据颜色直观特性由 A. R. Smith 1978 年创建一种颜色空间, 也称六角锥体模型。其中H、S、V分别代表色调(H)、饱和度(S)明度(V)。...它们补色是:黄色为60°,青色为180°,紫色为300°; 纯度S为一比例,范围从0到1,它表示成所选颜色纯度颜色最大纯度之间比率。S=0时,只有灰度。饱和度S表示颜色接近光谱色程度。...通常取值范围为0%~100%,越大,颜色越饱和。 V表示色彩明亮程度,范围从0到1。有一点要注意:它光强度之间并没有直接联系。...明度表示颜色明亮程度,对于光源色,明度与发光体光亮度有关;对于物体色,此物体透射比或反射比有关。通常取值范围为0%(黑)到100%(白)。 HSV对用户来说是一种直观颜色模型。...由于HSV是一种比较直观颜色模型,所以许多图像编辑工具中应用比较广泛,如Photoshop(Photoshop中叫HSB)等等,但这也决定了它不适合使用在光照模型中,许多光线混合运算、光强运算等都无法直接使用

98040

WPF 像素着色器进阶:使用 HLSL 编写一个高性能实时变化 HSLHSVHSB 调色盘

,符合人眼感知颜色表示方法,其中后两者只是名称不同,实际上是完全相同意思。...关于 HSL HSV/HSB 更多资料,可以参考 HSL and HSV - Wikipedia ▲ HSL ▲ HSV HSL HSV/HSB HLSL 代码 版本一:初步实现 由于...HSL HSV/HSBRGB 转换是非常广泛被使用,所以网上代码非常丰富,我们只需要让 GPT-4 帮我们生成一个就可以了: 这是 HSL 调色盘代码: sampler2D input...色相旋转角度,用于按照你需要将起始色相转到对应位置(右、上等) 亮度或明度,当指定这个时,整个调色盘最大亮度或明度就被限制到了这个 通常,1 2 直接在代码中设好就可以了,3 则通常是界面中额外显示一个滑块了整体调节...既然 GPT-4 那么强大,那么就劳烦一下它吧,经过反复询问以及我调试下,HSL 调色盘 HSV/HSB 调色盘精简指令全功能版本就出来啦,代码如下,大家可复制参考。

33010

UI界面配色方法终极指南!一篇长文搞定所有问题

色彩空间是指用于管理在此数字环境中表达色彩标准。在数码产品中,颜色主要是RGB、HSL、HSB等,工作时主要使用HEXRGB。...RGBA(红、绿、蓝、透明度):这是一种通过将光红、绿、蓝三基色与表示透明度相结合来表现各种颜色基本方法。 HSV/HSB(色相、饱和度、或亮度):这是一种直观且易于处理颜色属性)。...HEX:从RGB转换为十六进制代码,与其他元素相比具有可以一次复制粘贴优点,是一种通用颜色各种环境中都易于输入。 所有程序都使用 HSB 来选择颜色并使用 Hex 显示它们。...当您想使颜色变暗时,设计时要方便得多,因为当您看到 HSB 情况时,HSB 可以更直观地处理颜色属性,您可以减少 B 而不是通过混合红色、绿色蓝色来变暗 RGBA。...原因二、色相本身明暗度 虽然黄色很亮,很难白底上书写,蓝色很暗,很难黑底上书写,但很难想象不同颜色之间亮度差异。你怎么知道屏幕上看到色调本身亮度?

1.1K20

UI界面配色方法终极指南!一篇长文搞定所有问题repo

色彩空间是指用于管理在此数字环境中表达色彩标准。在数码产品中,颜色主要是RGB、HSL、HSB等,工作时主要使用HEXRGB。...RGBA(红、绿、蓝、透明度):这是一种通过将光红、绿、蓝三基色与表示透明度相结合来表现各种颜色基本方法。 HSV/HSB(色相、饱和度、或亮度):这是一种直观且易于处理颜色属性)。...HEX:从RGB转换为十六进制代码,与其他元素相比具有可以一次复制粘贴优点,是一种通用颜色各种环境中都易于输入。 所有程序都使用 HSB 来选择颜色并使用 Hex 显示它们。...当您想使颜色变暗时,设计时要方便得多,因为当您看到 HSB 情况时,HSB 可以更直观地处理颜色属性,您可以减少 B 而不是通过混合红色、绿色蓝色来变暗 RGBA。...原因二、色相本身明暗度 虽然黄色很亮,很难白底上书写,蓝色很暗,很难黑底上书写,但很难想象不同颜色之间亮度差异。你怎么知道屏幕上看到色调本身亮度?

73010

UI技巧 | 用户界面设计10个小技巧

直到我了解到色相、饱和度、亮度(HSB)上进行简单加法减法就能发挥魔法,在这个公式里我们将使用 HSB 色彩模式,而不是 RGB 模式。...我了解到最好起点是有一个基色,然后以基色为基础,保持色相相同,调整饱和度亮度。 方法B 方法B中,同样原理(上面的公式)依然适用,但是色相H发生了变化。...我们之前各种设计材料中使用颜色模式 RGB CMY 现在对我们来说很有用。 ? RGB 分别代表红色、绿色蓝色,而 CMY 代表青色、洋红色黄色。...除了两个组之间添加一条线来表示区分之外,组与组之间使用一个宽敞留白解决方案会更好、更容易。...正如邻近定律所说:相互靠近或接近物体,往往被归在一起。 我下方例子中,我目的是通过标题作者之间使用 24px 大留白来创建一个分隔。 ?

1.4K11
领券