小工具集

色卡生成器

选一个主色,自动生成互补、类似、三角等成套配色方案。

点色块复制 HEX,点数值复制 RGB。

关于色卡生成器

配色最难的不是选一个好看的颜色,而是选一组互相不打架的颜色。色卡生成器用色彩理论里的经典关系帮你把这一组算出来:互补、类似、三角、四角、分裂互补。

选定一个主色后,工具会在色轮上按固定角度关系推出其余颜色。这些方案不是随机生成的,而是有明确配色逻辑的,因此通常比随手挑几个颜色更协调。

每个色块都标了 HEX 和 RGB 值,点一下即可复制。所有计算在浏览器本地完成。

怎么用

  1. 选一个主色,或者直接输入 HEX 值
  2. 下方会列出多种配色方案,每组包含 4 到 5 个颜色
  3. 点任意色块复制它的 HEX 值
  4. 点色块下面的数值可以复制 RGB 值

常见问题

这些配色方案是怎么算出来的?
按色轮上的固定角度关系。互补色取色轮对面(相差 180°),类似色取相邻(相差约 30°),三角配色取三等分(相差 120°),四角配色取四等分(相差 90°)。这是色彩设计里的通用方法。
生成的颜色一定好看吗?
不一定。这些方案保证的是颜色之间的关系协调,但实际效果还取决于用法:哪个当背景、哪个当强调色、面积比例如何。一般建议挑一个当主色、一个当强调色,其余留作点缀。
HEX 和 RGB 有什么区别?
两者表示的是同一种颜色。HEX 是十六进制写法(如 #2563EB),常用于 CSS;RGB 是红绿蓝三个分量(如 rgb(37, 99, 235)),在需要调整透明度时更方便。
生成的颜色能商用吗?
颜色本身不受版权保护,可以自由使用。