Unity中颜色空间（Color）HSV,HSB,HSL

作为一名程序猿，也需要了解一下美术相关的一些知识，其实不用了解很多了，一点点就足够了，了解一下HSV,HSB,HSL的定义其实就OK了。

一 . 概念

HSL 模式和 HSV(HSB) 都是基于 RGB 的，是作为一个更方便友好的方法创建出来的。

HSB 为色相，饱和度，明度，
HSL 为色相，饱和度，亮度，
HSV 为色相，饱和度，明度。

HSB 和 HSV 是是一样的，只是叫法不同，HSL 则还有一些细微的区别：

在所有的情况下，H(Hue) 代表色相，S(Saturation) 代表饱和度。Hue（色相）是指取值范围在0-360°的圆心角，每个角度可以代表一种颜色。B 在 HSB 模式中是 Brightness 的意思, V 在 HSV 中是值，但是所表述的是一个东西：对光的量或光源的功率的感知。色相和明度（值）可以在0 - 1或者0% - 100%间取值。

HSL 稍微有一些不同，Hue（色相）和 HSB/HSV 模式中一样用数值表示，但是， S，同样代表“饱和度”，定义不一样，且需要转换。 L 代表亮度，和 Brightness/Value 不一样。Brightness（明度）是被认为是”光的量“，可以是任何颜色。而 Lightness（亮度）是作为”白的量“来理解的。Saturation（饱和度）不一样，因为在两个模型中，饱和度都按比例缩放以适应明度或亮度的定义。

两者的区别，和他们之间对于饱和度的定义的不同。

其实相关的定义就是这么简单。

二 . 实例

我们关心的主要就是在我们平常开发游戏的时候，怎么样编写出一个shader能够让我们去调节HSB颜色空间，而不仅仅是RGB空间。其实它们之间的转换已经有前人研究出来的公式了，我们只要套用公式即可了，各种颜色空间转换的具体公式详情：

http://www.easyrgb.com/index.php?X=MATH&H=22#text22

下面给出HSB转为RGB的shader：

发现其实美术调整颜色的时候大部分都是调整的HSV，因为可以方便的分别调整色相(hue)、饱和度(saturation)和色调(value)。例如人们要将颜色调整的偏红一点，那么只需要修改色相，如果使用RGB的话，就需要同时调整3个值，仅仅只是增加R值的话，理论上讲，只是把红色值加重了而已。就算是平时使用的调色板，大部分也是按照HSV来的，例如U3D的调色板：

颜色空间有很多中,RGB、HSL、HSV、CMYK...等等好多，如果有兴趣的话可以去搜搜。但我们这里只用HSV 。
比如一张贴图是红色系的，我们要改成绿色系，只需要将hue值偏移到绿色值就好了。

方法我们知道了，公式也有了，下面直接写代码。

Shader "Tornado/ColorGradation_HSV" {Properties {//贴图_MainTex ("MainTex (RGB)", 2D) = "white" {}//Hue的值范围为0-359. 其他两个为0-1 ,这里我们设置到3，因为乘以3后 都不一定能到超过._Hue ("Hue", Range(0,359)) = 0_Saturation ("Saturation", Range(0,3.0)) = 1.0_Value ("Value", Range(0,3.0)) = 1.0}SubShader {Pass {Tags { "RenderType"="Opaque" }LOD 200Lighting OffCGPROGRAM#pragma vertex vert_img#pragma fragment frag#include "UnityCG.cginc"sampler2D _MainTex;half _Hue;half _Saturation;half _Value;struct Input {float2 uv_MainTex;};//RGB to HSVfloat3 RGBConvertToHSV(float3 rgb){float R = rgb.x,G = rgb.y,B = rgb.z;float3 hsv;float max1=max(R,max(G,B));float min1=min(R,min(G,B));if (R == max1) {hsv.x = (G-B)/(max1-min1);}if (G == max1) {hsv.x = 2 + (B-R)/(max1-min1);}if (B == max1) {hsv.x = 4 + (R-G)/(max1-min1);}hsv.x = hsv.x * 60.0;   if (hsv.x < 0) hsv.x = hsv.x + 360;hsv.z=max1;hsv.y=(max1-min1)/max1;return hsv;}//HSV to RGBfloat3 HSVConvertToRGB(float3 hsv){float R,G,B;//float3 rgb;if( hsv.y == 0 ){R=G=B=hsv.z;}else{hsv.x = hsv.x/60.0; int i = (int)hsv.x;float f = hsv.x - (float)i;float a = hsv.z * ( 1 - hsv.y );float b = hsv.z * ( 1 - hsv.y * f );float c = hsv.z * ( 1 - hsv.y * (1 - f ) );switch(i){case 0: R = hsv.z; G = c; B = a;break;case 1: R = b; G = hsv.z; B = a; break;case 2: R = a; G = hsv.z; B = c; break;case 3: R = a; G = b; B = hsv.z; break;case 4: R = c; G = a; B = hsv.z; break;default: R = hsv.z; G = a; B = b; break;}}return float3(R,G,B);}       fixed4 frag (v2f_img i) : SV_Target{fixed4 original = tex2D(_MainTex, i.uv);    //获取贴图原始颜色float3 colorHSV;    colorHSV.xyz = RGBConvertToHSV(original.xyz);   //转换为HSVcolorHSV.x += _Hue; //调整偏移Hue值colorHSV.x = colorHSV.x%360;    //超过360的值从0开始colorHSV.y *= _Saturation;  //调整饱和度colorHSV.z *= _Value;                           original.xyz = HSVConvertToRGB(colorHSV.xyz);   //将调整后的HSV，转换为RGB颜色return original;}ENDCG} }FallBack "Diffuse"
}

同样的也可以应用到摄像机特效上….瞬间改变场景的氛围

图片来源于网络

Unity中颜色空间（Color）HSV,HSB,HSL相关推荐

HSV/HSB/HSL 色相、饱和度、亮度的色彩模型
文章目录什么是HSV/HSB/HSL Hue 色相 Saturation饱和度 Value 亮度互转公式 RGB to HSV 公式 HSV to RGB 公式 RGB to HSV & ...
RGB、YUV、HSV和HSL区别和关联
RGB.YUV.HSV和HSL区别和关联近期在做的一个需求和颜色转换有关系,所以本篇将开发过程中比较常见的四种颜色进行一番梳理. 一.RGB颜色空间从我们最常见的RGB颜色出发,RGB分别对应 ...
python中颜色空间直方图_OpenCV—python 颜色空间（RGB，HSV，Lab）与颜色直方图
一.图像分类的过程 image.png 图片必须经过标注图片的类别为有限的集合,如{猫.狗.牛.马.狼} 每个类别的图片数量接近,如果不同类别图片的数量差异很大,训练出来的分类器容易倾向于图片数量多 ...
opencv hsv(hsb)与hsl的区别
转载于:https://blog.csdn.net/u010712012/article/details/85240100 概念定义 RGB 是对机器很友好的色彩模式,但并不够人性化,因为我们对色彩的 ...
RGB、CMY、HSV、HSL颜色空间
1.颜色空间(又称彩色模型.色彩空间. 彩色系统等)是对色彩的一种描述方式,定义有很多种,区别在于面向不同的应用背景. 颜色空间的应用背景: 显示器中采用的RGB颜色空间是基于物体发光定义的(RGB对 ...
颜色空间探究：RGB、HSV和HSL
从RGB空间说起所谓RGB空间就是red,green和blue颜色3个向量张成的空间,正好类似于3维欧氏空间. 如图所示,3个向量均归一化了,其中(0,0,0)处为黑色,(1,1,1)处为白色.这种 ...
颜色空间(HSV/HSB与HLS)的区别
概念定义 RGB 是对机器很友好的色彩模式,但并不够人性化,因为我们对色彩的认识往往是"什么颜色?鲜艳不鲜艳?亮还是暗?". HSL 模式和 HSV(HSB) 都是基于 RGB 的 ...
RGB、HSV、HSL和YUV颜色空间
1. RGB 适合于显示系统,却并不适合于图像处理 (1) RGB是什么? RGB 是最常用于显示器的色彩空间,R(red)是红色通道,G(green)是绿色,B(blue)是蓝色通道.这三种颜色以不 ...
彩色图像--色彩空间 HSI(HSL)、HSV(HSB)
转自:http://blog.csdn.net/TonyShengTan/article/details/44277191 开篇废话色彩空间介绍最后两种与人类感知相对较接近的两种空间,彩色图像处理后 ...
07 HSV和HSL和YUV
HSV(HSB) opencv用的最多的色彩空间就是HSV HSV颜色空间是根据颜色的直观特性由A. R. Smith在1978年创建的一种颜色空间, 也称六角锥体模型(Hexcone Model). ...

Unity中颜色空间（Color）HSV,HSB,HSL

Unity中颜色空间（Color）HSV,HSB,HSL相关推荐

最新文章

热门文章