如何创建配色和谐
- 1
选择和谐类型
使用下拉菜单选择互补色、单色、类似色、三元色、四方色或分离互补色配色方案。
- 2
在色轮上调整颜色
点击并拖动色轮选择您的基色。和谐颜色将根据您的选择自动更新。
- 3
微调亮度
使用外部亮度环调整调色板的亮度，同时保持和谐关系不变。
- 4
复制或导出
点击色块可复制单个颜色，或使用导出按钮以各种格式下载您的调色板。
主要功能
交互式色轮
在可视化色轮上拖动并调整颜色，并通过独立的亮度控制环进行精确选色。
6种色彩和谐方案
自动生成互补色、单色、类似色、三元色、四方色和分离互补色配色方案。
多种颜色格式
以 HEX、RGB、HSL 和 CMYK 格式查看并复制颜色，支持一键复制到剪贴板。
导出与代码生成
可将调色板导出为 PNG 图像、PDF 文档、JSON 数据、CSS 变量、SCSS 变量或 Tailwind CSS 配置。
什么是色轮和色彩和谐？
色轮是根据颜色之间的色度关系排列的可视化颜色表示。色彩和谐是指颜色之间搭配得当、令人愉悦的排列。我们的交互式工具利用传统的色彩理论原则，如互补色（相对）、三元色（等距三色）和类似色（相邻色）配色方案，帮助您创建数学上平衡的颜色组合。
为何使用我们的色轮工具？
- 1
专业的色彩理论
基于艺术家和设计师数世纪以来用于创建视觉上吸引人的组合的传统色彩理论原则。
- 2
开发者友好的导出
生成可直接用于您的 Web 项目的 CSS 变量、SCSS 变量和 Tailwind CSS 配置文件。
- 3
多种导出格式
可将调色板导出为图像（PNG）、文档（PDF）或数据（JSON），以便在不同的设计工具和平台中使用。
- 4
实时视觉反馈
通过连接线可视化和谐关系，并交互式调整颜色，获得即时视觉反馈。
常见问题
提供哪些色彩和谐类型？
本工具提供6种和谐类型：互补色（2种相对的颜色）、单色（一种颜色的不同变化）、类似色（3种相邻的颜色）、三元色（3种等距的颜色）、四方色（4种等距的颜色）和分离互补色（1种颜色 + 与其互补色相邻的2种颜色）。
如何调整颜色的亮度？
使用色轮周围的外部亮度环。点击并拖动此环可调整和谐配色中所有颜色的明暗度，同时保持其色相和饱和度关系不变。
我可以复制单个颜色吗？
是的，点击任意色块即可将其值复制到剪贴板。您可以使用格式选择按钮在 HEX、RGB、HSL 和 CMYK 格式之间切换。
支持哪些导出格式？
您可以导出为 PNG 图像、PDF 文档、JSON 数据、CSS 变量、SCSS 变量和 Tailwind CSS 配置文件。每种格式都针对不同的使用场景进行了优化。
如何使用生成的 CSS 变量？
从导出弹窗中复制 CSS 变量并粘贴到您的样式表。然后您可以像这样使用它们：background-color: var(--color-1); 或 color: var(--color-2);
我可以单独拖动和谐色吗？
是的，您可以拖动任何和谐色点来调整整个调色板。主色将自动重新计算，以保持所选和谐类型的数学关系。