Color Palette Generator

调色板生成器可根据一个基色自动生成完整的多色调配色方案。工具基于 HSL（色相、饱和度、明度）色彩空间，通过调整饱和度和明度值来创建不同层次的同色系颜色。它支持多种调色板模式：单色（Monochrome）、互补色（Complementary）、三角色（Triadic）、类比色（Analogous）和四角色（Tetradic），每种模式基于色相环的特定角度关系。你可以导出完整的 CSS 变量或颜色值列表，直接用于前端项目。

调色板生成器在前端开发中广泛应用。Tailwind CSS 用户利用它生成自定义主题色调（primary-50 到 primary-950），扩展默认调色板。设计系统作者使用它快速建立品牌颜色体系。开发者在构建演示页面或原型时用它获取协调的配色方案。同时它也适用于数据可视化，为图表序列生成可区分且协调的颜色集合。

生成的调色板可以使用 颜色转换器 在不同格式之间转换，或使用 对比度检查器 验证文字与背景的对比度是否符合无障碍标准。

调色板生成依赖于色相环上的几何关系：

• 单色（Monochrome）：保持相同色相，仅改变饱和度和明度，产生最协调的渐变效果。
• 互补色（Complementary）：色相环对面（180°），产生强对比效果，适合强调和呼吁注意。
• 三角色（Triadic）：色相环上间隔 120° 的三个颜色，均衡且生动。
• 类比色（Analogous）：色相环上相邻 30° 的颜色，和谐自然。
• 四角色（Tetradic）：两对互补色组成的矩形，丰富但需要谨慎搭配。

• 色彩数量：不要在一个页面中使用超过 5 种主要颜色（不含灰度），过多的颜色会让界面显得杂乱。
• 语义使用：为颜色定义语义角色（如 primary、success、warning、error、info），而非直接使用色值。
• 暗色模式适配：亮色模式下的 shade 层级在暗色模式下需要反转，确保两种模式下都有一致的视觉层级。
• 色盲友好：避免仅依赖颜色区分信息（如红/绿状态），应同时使用图标或文字辅助。

在设计阶段探索配色方案、快速生成 Tailwind 自定义主题色调、或为组件库建立颜色 tokens 时使用此工具。对于需要程序化生成大量调色板的场景（如动态主题系统），推荐使用 color.js、chroma.js 或 d3-scale-chromatic 等库，它们提供可编程的调色板生成能力和更精细的颜色空间控制。