什么是配色方案生成？
配色方案生成器在 HSL 空间从一个基准色派生同色阶、邻近色、互补色与三角配色四类方案，并输出可直接使用的 CSS 变量。生成在浏览器本地完成。
怎么用配色方案生成？
- 1选择基准色（通常是品牌主色）。
- 2切换方案类型查看不同派生结果。
- 3复制 CSS 变量，作为设计令牌的起点。
- 4关键搭配请再用对比度检测工具验证可读性。
常见问题
为什么在 HSL 空间生成而不是直接调 HEX？+
因为 HSL 把颜色拆成色相、饱和度、亮度三个可独立控制的维度：做色阶只改亮度、做配色只转色相，结果自然协调。直接在 HEX 上手调很难保证不同色阶之间的一致性。
生成的色阶可以直接用吗？+
可以作为起点，但要补一步验证。等间距的亮度在人眼感知上并不等间距（尤其黄色与蓝色区间），关键的文字与背景组合必须用对比度检测确认是否达到 WCAG 标准。