用代码着色，一种程序化的设计绝佳方法。学习创建美丽、鼓舞人心和独特的调色板/组合，所有都会让你的网页和文本编辑变得更加舒适！废话不多说，今天带着大家认识下LCH颜色表达方式！
颜色是强大的——它可以从根本上改变我们的情绪，激励我们，并帮助我们以一种其他事物无法做到的方式表达自己。在设计中我们常听到的是RGB（常用的网页颜色三元素）以及打印的CMYK；为了更好的视觉效果，我们也需要了解LCH颜色！这样可以让我们的网页更加有层次感，高级感十足！当你了解了这篇文章后，绝对会提升你的审美观。老板看了你写的网页，绝对是赞不绝口。还要给你加薪！
什么是LCH颜色
LCH代表亮度（颜色的深/浅）、色度（颜色的鲜艳/饱和度）和色调（颜色是红色、绿色、蓝色……）。
简而言之，LCH是一种与RGB或HSL一样的颜色表示方式，但有一些显着的优势——对于本教程来说最重要的是它的感知均匀性。在本教程中，我们几乎只使用LCH颜色。我知道这听起来有点吓人，但我保证不会；让我告诉你这意味着什么！
首先，看看这两对HSL颜色：
请注意，尽管顶部和底部对具有相同的20度色相变化，但我们实际看到的差异却大不相同？这种不平衡的存在是因为HSL在感知上并不统一。
现在看看同样的实验，这次使用LCH颜色：
HSL和LCH之间的色调值不能完美对齐。在LCH中，0的色调更粉红色，而在HSL中，它是纯红色。啊，好多了！
这里看到的色调变化更加平衡，因为LCH在感知上是均匀的。接下来，我们来看看另外两种HSL颜色：
这两种颜色具有相同的亮度值，但在我们的人眼看来却大不相同。左边的黄色比右边的蓝色“亮”得多。
这是一个类似的设置，但使用的是LCH颜色而不是HSL：
这还差不多！如上图所示，LCH中的亮度值更准确地表示了我们所感知的内容——这与LCH的均匀色调分布相结合，将使我们在创建和谐的调色板时更加轻松。
目前，这就是我们需要知道的全部内容，但如果您想了解更多信息，我强烈推荐LeaVerou撰写的这篇文章。
我们将在本教程中使用一个库，但本机LCH支持正在走向浏览器！事实上，它已经存在于Safari中，其他浏览器目前也在使用它。
跟着
在我们编写任何代码之前，我们需要一个简单的开发环境。此设置完全由您选择，但我建议您启动CodePen或者vscode以跟随示例，然后在需要时移至自定义设置/存储库。真的，我们在这里只需要一个HTML/JavaScript文件，我们将使用Skypack进行所有库导入，因此不需要任何花哨的构建过程等。
功能#1——“科学”
好的！首先，我们使用“传统”颜色理论生成颜色。要开始使用此方法，让我们看一下称为色轮的东西：
看起来熟悉？
色轮是色彩空间中色调的视觉表示。上面的轮子代表LCH中的色调，以30度的步长递增，从0度到度——这是一种成熟的格式。事实上，数百年来，我们一直在使用轮子来寻找可以很好地协同工作的颜色！
这是如何做：
我们从基色开始。然后，我们围绕轮子旋转一定度数一定次数；为了完美互补的调色板，我们移动度一次：
迷人的！对于三元调色板，我们移动度，两次：
看看这是怎么回事？通过改变步数和旋转量，我们可以创建几个“经典”调色板
代码
functionadjustHue(val){if(val0)val+=Math.ceil(-val/)*;returnval%;}functioncreateScientificPalettes(baseColor){consttargetHueSteps={analogous:[0,30,60],triadic:[0,,],tetradic:[0,90,,],