最近看颜色值的时候，颜色不只是一个字符串，背后的故事也很吸引人，三维几何坐标rgb，hsl的柱坐标，有学习的地方。一起来看看吧。?关键字表示一种颜色。关键字表示特定的颜色。这里的颜色都是人为语义命名的。你可以在这里找到关键词列表rgb[1]rgb[a]是按照rgb三维坐标系表示的，可以用#{hex}，或者用rgb[a]()方法表示。mdn:rgb三维坐标系说明：将rgb颜色模型映射到一个数据集。水平x轴为红色向左递增，y轴为蓝色向右下方递增，垂直z轴为绿色向上方递增，图中隐藏了黑点.几何表示通常颜色由三部分定义，不仅在rgb模型中，而且在其他模型中，如CIELAB和Y'UV，它们通过将数据视为普通笛卡尔坐标来描述3D体积。在欧几里德空间中，对于rgb模型，用0-1范围内非负值的立方体表示（如上图），在顶点处指定原点为black(0,0,0)，并沿三个轴增加强度值，直到顶点(1,1,1)为白色，对角线处为黑色。rgb顶点(r,g,b)标识立方体表面边缘或给定颜色的内部点的3D坐标。这种方法允许简单地通过计算它们之间的距离来计算两种颜色的相似度，距离越短，相似度越高。也可以使用此方法执行越界计算。参考：https://en.wikipedia.org/wiki...rgb颜色模型从html3.2开始在网页中正式引入互联网标准。虽然这已经使用了一段时间，但最初大多数视频硬件的有限颜色深度导致了216种调色板。由NetscapeColorCube定义。凭借24位显示器的优势，使用完整的1670万种HTMLRGB颜色代码颜色对大多数用户来说不再是问题。网络安全调色板（palette）推荐216(6^(3))为红、绿、蓝的6个值（十六进制）之一：#00、#33、#66、#99、#CC或#FF（基于上面讨论的每个值的0到255范围）。上述十六进制值对应十进制值：0、51、102、153、204、255。它们对应的强度分别为=0%、20%、40%、60%、80%、100%。css中的语法如下：rgb(#,#,#)其中#等于红绿蓝的比例。此语法可以在背景颜色或（文本）颜色等选择器之后使用。在24位显示器中，每24bit是一个颜色通道值，也就是说每个像素点可以存储24个字节（8×3）。它由三个8字节(2^(3))组件表示。这三个分量分别代表R、G和B。24位的rgb可以表示2^(24)种颜色，每8位就有256种表示，即2^(8)*，2^(24)==256^(3)==16,777,216种颜色，又称千色。参考：https://en.wikipedia.org/wiki...https://baike.baidu.com/item/RGBhttps://en.wikipedia.org/wiki...hsl(a)hsl[a]它是一个用hsl柱坐标表示的系统，形式用hsl[a]()表示。这里还有一个表示，叫做hsv[a]()，下面继续看。柱坐标表示hsl图(1)hsv图(2)HSL和HSV都是圆柱形几何形状(图2)，具有色相(hue)，它们的角大小从红原色0°开始，穿过绿原色120°，蓝原色240°，然后绕到红原色360°，这里表示0^(°)==360^(°)==红。在每个几何图形中，中心垂直轴（饱和度）包括中性（50%）、无色（100%）或灰色（0%），范围从亮度/值0或值0到黑色（底部）到亮度1的值值为1的白色或顶部。https://en.wikipedia.org/wiki...HSL和HSV都是圆柱形几何体（图2），具有色调，它们的角度尺寸，从0°的红色主色开始，以120°穿过绿色主色°和240°处的蓝色主色，然后在360°处折回到红色。在每个几何图形中，中心垂直轴包含中性、非彩色或灰色，范围从亮度为0或值0的黑色（底部）到亮度为1或值1的白色（顶部）。动机（Motivation）HSL色彩空间是GeorgesValensi于1938年为电视发明的。大多数电视、电脑显示器和投影仪通过组合不同强度的红、绿和蓝光（所谓的RGB添加原色）来产生颜色。在RGB颜色空间中产生的混合物可以再现多种颜色（称为色域）；然而，红光、绿光和蓝光的成分量与产生的颜色之间的关系是不直观的，尤其是对于没有经验的用户，以及熟悉基于色调和色调的涂料或传统艺术家模型的减色混合的用户（下图）.此外，加色模型和减色模型都没有像人眼那样定义颜色关系。画家通过将相对明亮的颜料与黑色和白色相结合来实现长混色。白色混合物称为色调，黑色混合物称为阴影，两者的混合物称为色调。示例：假设我们有一个RGB显示器，其颜色由0到255之间的三个滑块控制，一个滑块控制红色、绿色和蓝色原色中每一种的强度。如果我们从一个颜色比较鲜艳的橙色开始，sRGB值为R=217，G=118，B=33，想把它切成两半变成饱和度较低的橙色，我们需要拖动滑块将R减小31、G增加24，B增加59，如下图。当前的颜色混合模型非常不直观，在绘画中-涉及将颜色鲜艳的颜料与黑色或白色混合以获得更浅、更深或更少颜色的颜色。次年，即1979年，在SIGGRAPH上，泰克推出了使用HSL进行颜色规范的图形终端，计算机图形标准委员会在其年度状态报告中推荐了它（图7）。这些模型之所以有用，不仅因为它们比原始RGB值更直观，还因为RGB转换计算非常快：它们可以在1970年代的硬件上实时运行。因此，从那时起，这些模型和类似模型在图像编辑和图形软件中变得无处不在。为了适应更传统和直观的颜色混合模型，PARC和NYIT的计算机图形学先驱在20世纪70年代中期为计算机显示技术引入了HSV模型，AlvyRaySmith[10]在1978年8月的计算机杂志上正式描述了该模型图形。在同一期中，Joblove和Greenberg[11]描述了HSL模型——他们将其维度标记为色调、相对色度和强度——并将其与HSV进行了比较（图1）。他们的模型更多地基于颜色在人类视觉中如何根据其他颜色制作属性（例如色调、亮度和色度）进行组织和概念化；以及传统的颜色混合方法——例如，在绘画中——涉及将颜色鲜艳的颜料与黑色或白色混合以获得更浅、更深或颜色更少的颜色。次年，即1979年，在SIGGRAPH上，泰克推出了使用HSL的图形终端颜色指定和计算机图形标准委员会在他们的年度状态报告中推荐了它（图7）。这些模型之所以有用，不仅因为它们比原始RGB值更直观，还因为与RGB之间的转换计算速度极快：它们可以在1970年代的硬件上实时运行。因此，从那时起，这些模型和类似模型在图像编辑和图形软件中变得无处不在。它们的一些用途如下所述。hsl的用法是用三个参数来表示色相（hua）饱和度（saturation）透明度（lightness）可以发现上图中red=0=360^(°)，所以green=120^(°),blue=240^(°)饱和度和明度均为100%表示：100%为全饱和度，0%为灰度，100%明度为白色，0%明度为黑色，50%为一般色根据hsl图标，100%亮度，不管饱和度是多少，都是白色，0%同hsl(0,100%,50%)/*red*/hsl(30,100%,50%)hsl(60,100%,50%)hsl(90,100%,50%)hsl(120,100%,50%)/*绿色*/hsl(150,100%,50%)hsl(180,100%,50%)hsl(210,100%),50%)hsl(240,100%,50%)/*蓝色*/hsl(270,100%,50%)hsl(300,100%,50%)hsl(330,100%,50%)hsl(360,100%,50%)/*红色*/hsl(120,100%,25%)/*深绿色*/hsl(120,100%,50%)/*绿色*/hsl(120,100%,75%)/*浅绿色*/hsl(120,100%,50%)/*绿色*/hsl(120,67%,50%)hsl(120,33%,50%)hsl(120,0%,50%)hsl(120,60%,70%)/*pastelgreen*/Summary通过搜索资料，我们发现Colors不仅是关键字，不仅是#000，不仅是rgb，还有hsl、hsv等表示。学习简单的颜色其实并不容易。设计颜色和像素的关系，颜色组合，为什么是hex的时候是0-255，什么是千种颜色。文中如有错误，请指正，谢谢。？
