调色板生成器
CSS颜色调色板生成工具，支持色彩和谐搭配
颜色Palette生成器
主色
亮变
暗变
互补
互补亮
#3C83F6
主色
#9EC1FA
亮变
#0950C3
暗变
#F6AF3C
互补
#F9CD85
互补亮
CSS 变量
:root {
--color-1: #3C83F6;
--color-2: #9EC1FA;
--color-3: #0950C3;
--color-4: #F6AF3C;
--color-5: #F9CD85;
}
/* 使用示例 */
.color-1 { color: #3C83F6; }
.color-2 { color: #9EC1FA; }
.color-3 { color: #0950C3; }
.color-4 { color: #F6AF3C; }
.color-5 { color: #F9CD85; }使用说明
选择基础颜色和配色方案类型，生成5个协调色的调色板。支持类比色、互补色、三色、四色和单色方案。
使用步骤
- 输入一个基准颜色（HEX 或拾色器选择）。
- 选择配色方案（互补、类似、三色、四色等）。
- 生成 5 个协调色。
- 复制单个颜色或导出完整色板。
常见问题
配色方案有什么区别？
互补色对比强烈，类似色和谐统一，三角形配色活泼，四色矩形配色丰富。选择取决于设计风格。
可以导出为 CSS 变量吗？
支持导出为 CSS 自定义属性（:root { --color-1: #xxx; }）格式。