宇前言
颜色，无论是在我们的衣服设计上、环境设计上以及网页设计上，都是能够给人们视觉体验第一的地方。一个好的颜色搭配，能够给访客增强极大的体验。在 THYUU/星度主题里，为了更好体现宇宙星辰每一颗星都是独立个体的概念，在主题颜色设定上采用了双色搭配，正如地球与月球、太阳系与银河系，相互围绕、相互吸引的哲学一般。
本期，介绍 THYUU/星度主题中主辅双色的特性设定，如何搭配双色增强体验，以及在面对不同搭配时的效果会是如何。
网页设计中颜色属性
在 HTML 中，颜色可以通过多种方式表示，我们可以嵌入包括颜色名称、十六进制代码、RGB 值和 HSL 值。以下是关于 HTML 中颜色的详细说明。
颜色名称
HTML 支持一些预定义的颜色名称，例如：red、blue、green、yellow、black、white 等。这些颜色名称可以直接用在 HTML 的颜色属性中。
HEX（十六进制颜色代码）
HEX 是一种颜色表示法，使用 16 进制数字（0-9 和 A-F）来表示颜色。它是 Web 开发中最常用的颜色表示法之一。格式为 #RRGGBB，其中：
- RR 表示红色分量（00 到 FF），所以红色的值是：
#FF0000 - GG 表示绿色分量（00 到 FF），所以红色的值是：
#00FF00 - BB 表示蓝色分量（00 到 FF），所以红色的值是：
#0000FF
RGB 值
RGB 表示颜色的红、绿、蓝分量，格式为 rgb(R G B / A)
- R、G、B 是 0 到 255 的整数
- A 是透明度，取值范围是 0（完全透明）到 1（完全不透明）
HSL 值（星度主题采用此方式）
HSL 是一种基于人类感知的颜色模型，因此您无需掌握三原色原理，即可轻松学会调色，所以这就是将它作为主题的默认颜色属性值的原因。接下来我们重点介绍本节。
Hue（色相）
色相（Hue） 是 HSL 颜色模型中的第一个参数，用于表示颜色的种类。用角度（0° 到 360°）表示对应色轮上的位置。色相基于色轮的概念，色轮是一个圆形，将颜色按照光谱的顺序排列。色轮上的每种颜色都可以通过角度来唯一确定。
Saturation（饱和度）
表示颜色的鲜艳程度，取值范围是 0% 到 100%。饱和度可以用来调整颜色的鲜艳程度，非常适合用于创建渐变、动画或调整颜色的视觉效果。
- 0%：灰度（无色彩）
- 100%：最鲜艳的颜色
Lightness（亮度）
表示颜色的明暗程度，取值范围是 0% 到 100%。亮度可以用来调整颜色的明暗程度，非常适合用于创建渐变、动画或调整颜色的视觉效果。
- 0%：黑色
- 50%：正常亮度
- 100%：白色
书写格式
- 基本格式：hsl(H, S%, L%, A)
- 现代格式：hsl(H S% L% / A) —— 星度采用的格式
可至 w3school 工具体会 HSL 学习 https://www.w3school.com.cn/css/css_colors_hsl.asp
颜色搭配公式
公式一：单色（统一柔和的方案）
通俗来说，单色搭配就是用一个颜色，改变颜色的明暗、鲜艳程度，达到色彩和谐统一的目的。这样的配色非常适合新手，在软件里边直接调整明度和纯度即可达到非常漂亮的效果，色彩会比较柔和，对比度也相对弱一些。
公式二：邻近色（协调自然的方案）
邻近色指的是在色相环上相邻的颜色，特点是色彩会显得有层次，比起单色配色来说，整体效果会协调自然，还带着一点活泼的味道~
公式三：互补色（视觉冲击的方案）
互补色搭配可以理解为在色相环上相差 180°的颜色，又叫它对面的颜色，比如红绿配色。这样的颜色搭配对比会比较强烈，视觉冲击力比较强。但是需要注意颜色块面的比例，不能做五五开，可以在明度和纯度上做一些变化。
公式四：三元色（强烈对比度的方案）
等边三角形配色又叫三原色配色，在色相环上呈等边三角形。色彩之间相互碰撞，对比强烈，画面的视觉冲击力强，一些年轻化的海报、个性化的创作，都非常适合用等边三角形配色来做设计。但是也要注意确定谁作为主色调、谁定为辅助色，颜色块面的大小也要把握好节奏喔~
公式五：拆分互补色（相同对比度的方案）
分裂互补色因为比较难以理解，所以大家可以称它为等腰三角形配色，它的规律刚好是在色相环上呈等腰三角形，这样的配色方式既显得和谐稳定，使你获得与补色方案相同的对比度。
公式六：四元色（一色主导的方案）
四元色方案在色环上形成一个矩形，使用不是一对而是两对互补色。如果你让一种颜色占主导地位，而其他颜色充当强调色，则此方案效果最佳。
在线颜色搭配工具推荐
星度主题为你提供了的在线配色工具，你可以在星度主题介绍站中的“亮点”频道中找到，在拉条中实时查看配色效果。
如果实在没有好的颜色方向，也可以查看下方的在线配色网站：
- 配色卡：https://peiseka.com/peisedaohang.html
- fffuel：https://www.fffuel.co/cccolor/
- 创意家园：https://www.chinavid.com/color.html
结语
无论你在哪里看，颜色在设计和日常生活中起着至关重要的作用。它能把你的眼球及引到图像上。有时它会引发情绪反应。它甚至可以不用文字来传达重要信息。THYUU/星度主题精心地带来丰富的浏览体验，搭配一套属于你自己的颜色，无论是主题拥有者还是站点访问者，都会感受到不同的 STYLE 体验。
下一期将为大家介绍，THYUU/星度主题中字体及图标的特性设定，如何引入注目的标题字体，以及不同字体的在不同用途时的效果会是如何。