RGB、HSB\HSV、HSL三种颜色空间的原理理解与转换

2023-10-13 16:10

本文主要是介绍RGB、HSB\HSV、HSL三种颜色空间的原理理解与转换,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

『"Color" refers to the human brains subjective interpretation of combination of a narrow band of wavelength of light』---- WIKIBOOKS

简单说来,颜色是人脑对不同波段光长的主观理解。

----------------------------------Primary Colors------------------------------------

元色,这个可以理解为向量空间的基。

也就是说一个颜色空间的所有色彩都可以通过这个空间的元色通过某种方式生成。(简单的就是线性相加,比如rgb空间)


Tranditional Colors

站在巨人肩上的巨人大牛顿在1672年使用,红、黄、蓝做为三元色。这组组合也被称为"Painter's Colors",现在仍在使用。

但这种组合并不能完全生成所有的颜色。


Subtractive Colors

应用减法框架的颜色空间,三元色:蓝绿、黄色和洋红(cyan, yellow and magenta)。

这种框架下的颜色是,使用白光减去三种光源成份得到色彩。如下图:




Additive Colors

应用加法的颜色空间,其中的颜色由原色相加得到。比如我们常见的RGB(Red, Green, Blue)。





----------------------------------HSL------------------------------------

H指Hue,可以理解为区别颜色的名称、类型,比如黄色、蓝色等。

S指Saturation,指颜色的『丰满』程度,该值越大,颜色越艳丽。

L指Lightness,指亮度。从黑到白。


三者之间的关系是:

该颜色空间中,心Lightness为轴心;Hue围绕L旋转过程中颜色发生变化;每一个与L正交的平面上,以交点为中心向某方向(H)发射的射线是S。


我觉得colorizer.org上面的图挺形象,搬过来如下:






----------------------------------HSB与HSV------------------------------------

注意,这两个东西是大大滴不同。

这两者里面的Hue都是指的同一个拿含意(可以理解成颜色类型),可以用下面这个色环表示:



但它们的其它两维(尤其是saturation)所指的含义却差别很大。

在HSL中:

Lightness控制颜色,从黑到hue再到白。颜色的明亮程度完全靠L控制。

Saturation控制颜色的灰度冷暖。


但在HSB中:

同一Hue颜色的冷暖、色调、明暗受Saturation和Brightness(value)共同影响。

下面这两幅图对比比较明显。



可以在http://colorizer.org/尝试调整不同维度值,感受颜色变化。



----------------------------------转换公式------------------------------------

RGB 到 HSB\HSV


RGB 到 HSL



其中,M = max(R, G, B), m = (R, G, B)。


HSB\HSV 到HSL



HSL 到 HSV\HSB








参考:http://colorizer.org/

https://en.wikipedia.org/wiki/HSL_and_HSV

https://en.wikibooks.org/wiki/Color_Models:_RGB,_HSV,_HSL

http://codeitdown.com/hsl-hsb-hsv-color/


这篇关于RGB、HSB\HSV、HSL三种颜色空间的原理理解与转换的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/204375

相关文章

Java StringBuilder 实现原理全攻略

《JavaStringBuilder实现原理全攻略》StringBuilder是Java提供的可变字符序列类,位于java.lang包中,专门用于高效处理字符串的拼接和修改操作,本文给大家介绍Ja... 目录一、StringBuilder 基本概述核心特性二、StringBuilder 核心实现2.1 内部

使用Python批量将.ncm格式的音频文件转换为.mp3格式的实战详解

《使用Python批量将.ncm格式的音频文件转换为.mp3格式的实战详解》本文详细介绍了如何使用Python通过ncmdump工具批量将.ncm音频转换为.mp3的步骤,包括安装、配置ffmpeg环... 目录1. 前言2. 安装 ncmdump3. 实现 .ncm 转 .mp34. 执行过程5. 执行结

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

ShardingProxy读写分离之原理、配置与实践过程

《ShardingProxy读写分离之原理、配置与实践过程》ShardingProxy是ApacheShardingSphere的数据库中间件,通过三层架构实现读写分离,解决高并发场景下数据库性能瓶... 目录一、ShardingProxy技术定位与读写分离核心价值1.1 技术定位1.2 读写分离核心价值二

深度解析Python中递归下降解析器的原理与实现

《深度解析Python中递归下降解析器的原理与实现》在编译器设计、配置文件处理和数据转换领域,递归下降解析器是最常用且最直观的解析技术,本文将详细介绍递归下降解析器的原理与实现,感兴趣的小伙伴可以跟随... 目录引言:解析器的核心价值一、递归下降解析器基础1.1 核心概念解析1.2 基本架构二、简单算术表达

JavaScript中比较两个数组是否有相同元素(交集)的三种常用方法

《JavaScript中比较两个数组是否有相同元素(交集)的三种常用方法》:本文主要介绍JavaScript中比较两个数组是否有相同元素(交集)的三种常用方法,每种方法结合实例代码给大家介绍的非常... 目录引言:为什么"相等"判断如此重要?方法1:使用some()+includes()(适合小数组)方法2

Three.js构建一个 3D 商品展示空间完整实战项目

《Three.js构建一个3D商品展示空间完整实战项目》Three.js是一个强大的JavaScript库,专用于在Web浏览器中创建3D图形,:本文主要介绍Three.js构建一个3D商品展... 目录引言项目核心技术1. 项目架构与资源组织2. 多模型切换、交互热点绑定3. 移动端适配与帧率优化4. 可

深入浅出Spring中的@Autowired自动注入的工作原理及实践应用

《深入浅出Spring中的@Autowired自动注入的工作原理及实践应用》在Spring框架的学习旅程中,@Autowired无疑是一个高频出现却又让初学者头疼的注解,它看似简单,却蕴含着Sprin... 目录深入浅出Spring中的@Autowired:自动注入的奥秘什么是依赖注入?@Autowired

Python中Json和其他类型相互转换的实现示例

《Python中Json和其他类型相互转换的实现示例》本文介绍了在Python中使用json模块实现json数据与dict、object之间的高效转换,包括loads(),load(),dumps()... 项目中经常会用到json格式转为object对象、dict字典格式等。在此做个记录,方便后续用到该方

从原理到实战解析Java Stream 的并行流性能优化

《从原理到实战解析JavaStream的并行流性能优化》本文给大家介绍JavaStream的并行流性能优化:从原理到实战的全攻略,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的... 目录一、并行流的核心原理与适用场景二、性能优化的核心策略1. 合理设置并行度:打破默认阈值2. 避免装箱