解决具体问题：为什么你的网页配色看起来很“脏”？
在设计网页或移动应用时，配色是最容易出错的环节。很多新手设计师倾向于随机选择颜色，结果往往导致页面视觉混乱、对比度失调，或者给人一种不专业的“廉价感”。 Palette Generator 调色板生成器 通过数学算法将色彩理论工具化，帮你从根本上解决色彩搭配的科学性问题。
1. 什么是和谐的配色方案？
和谐的配色并非玄学，而是基于色相环（Color Wheel）的几何关系。通过我们的工具，你可以尝试以下几种经典算法：
- 互补色 (Complementary)： 选择色相环上完全相对的两种颜色。这种方案具有极强的视觉冲击力，非常适合用于“行动导向按钮 (CTA)”。
- 类似色 (Analogous)： 选择色相环上相邻的颜色。这种搭配非常自然、宁静，常用于背景和辅助装饰。
- 三色方案 (Triadic)： 在色相环上取等边三角形的三个顶点。它既能保持丰富的色彩感，又能维持平衡。
- 单色方案 (Monochromatic)： 基于同一种色相，通过调整明度和饱和度来产生变化。这是最保险且极具高级感的 UI 配色方式。
2. 解决 UI 设计中的色彩平衡：60-30-10 法则
即便有了完美的调色板，如何分配比例也至关重要：
- 60% 主色： 通常用于背景或大面积区域，应选择较低饱和度的颜色。
- 30% 辅助色： 用于导航栏、卡片、副标题等，增加层次感。
- 10% 强调色： 用于最重要的交互点。互补色算法生成的颜色最适合扮演这个角色。
3. 色彩心理学与品牌传达
不同的配色算法能传达截然不同的情感：
- 蓝色调： 传达专业、信任与稳定，是金融和科技行业的首选。
- 绿色调： 象征健康、成长与自然，适用于医疗或环保类产品。
- 红色/紫色调： 充满活力、创意与热情，能有效刺激用户的购买欲望。
4. 如何在 CSS 中应用生成的配色？
点击“导出配色”按钮，你可以获得一组 CSS 自定义属性（变量）。建议将这些变量放置在
:root
中，以便在整个项目中保持色彩的一致性：
:root {
--color-primary: #7fbf4a;
--color-secondary: #...;
/* ... */
}