Question 1

什么是配色方案？

Accepted Answer

配色方案是基于色彩理论，从一个基础颜色出发，按照特定规则生成一组协调的颜色组合。常见的有互补色（色轮上对立的两个颜色）、类似色（色轮上相邻的颜色）、三色组（色轮上等距的三个颜色）等。好的配色方案能让设计作品更加和谐美观。

Question 2

如何选择合适的配色方案？

Accepted Answer

选择配色方案需考虑设计目的：互补色适合需要高对比度的设计；类似色适合营造柔和统一的氛围；三色组和四色组适合需要丰富色彩的设计；单色方案适合简约风格。建议先确定主色调的情感基调，再选择对应方案。

Question 3

HEX、RGB、HSL 三种颜色格式有什么区别？

Accepted Answer

HEX 是十六进制表示法（如 #FF6B35），简洁直观；RGB 用红绿蓝三通道值表示（如 rgb(255, 107, 53)），适合编程使用；HSL 用色相、饱和度、明度表示（如 hsl(20, 100%, 60%)），最接近人眼感知，方便调色。三者可以互相转换，表示同一颜色。

Question 4

导出的 CSS/SCSS/Tailwind 代码怎么用？

Accepted Answer

CSS 变量可直接放在 :root 选择器中，用 var(--color-primary) 使用；SCSS 变量放在样式文件顶部，用 $color-primary 使用；Tailwind 配置放在 tailwind.config.js 的 theme.extend.colors 中，用 bg-primary 等类名使用。导出后可直接复制到项目中。

配色方案生成器

配色方案生成器使用说明

主要功能

使用场景

常见问题

相关工具