品牌配色方案

功能说明

品牌配色方案工具，基于色彩理论自动生成和谐配色方案。输入主色后，选择配色模式，即可获得专业设计师级别的配色组合，适用于品牌设计、UI界面、海报制作等场景。

配色模式说明

互补色：色轮上180度相对的两种颜色，对比强烈，适合强调重点。

相邻色：色轮上相邻的3-5种颜色，柔和协调，适合整体配色。

三色搭配：色轮上等距分布的三种颜色，平衡且富有活力。

分裂互补：在互补色基础上增加两侧相邻色，折中对比与和谐。

四色搭配：两组互补色，色彩丰富，适合多彩品牌。

单色渐变：同一色相不同明度和饱和度的变化，高级感强。

如何使用？

1. 在颜色框输入十六进制色值（如 #1890ff），或点击右侧色板选择颜色。

2. 选择配色模式。

3. 点击「生成配色」，查看配色方案。

4. 点击任意色块，一键复制色值。

你可能还想问

生成的配色怎么保证对比度够用？

正文与背景的对比度建议达到 WCAG AA 级 4.5:1 以上；生成方案后用对比度检查工具核验文字色，装饰色可放宽。

主色和强调色怎么分配比例？

经典 60-30-10 法则：60% 中性底色、30% 主色、10% 强调色；强调色留给按钮、链接等需要引导点击的元素。

配色能直接用到 CSS 里吗？

复制 HEX 或 RGB 值写入 CSS 变量即可；建议同时记录深浅色两个版本的变量，方便后续做暗色主题切换。

相关工具

相关内容