色彩和谐轮 具有五种和谐类型的交互式色轮，支持视觉选择。

What Is 色彩和谐轮?

色彩和谐轮是一个交互式工具，它将视觉色轮与五种经典的色彩和谐规则相结合。选择一种和谐类型并点击色轮（或使用滑块）来查看颜色在该方案中如何相互关联。和谐线和点直接叠加在色轮上，使抽象的色彩理论概念变得视觉化直观。你可以一眼看到互补颜色如何坐在彼此对面，三角颜色如何形成等边三角形，以及类似颜色如何聚集在一起。这既是一个生成和谐调色的实用工具，也是理解色彩理论的教育资源。该轮使用Canvas API渲染，显示您选择的饱和度和亮度的全色谱，并且具有交互式的和谐点。

Why Use 色彩和谐轮?

• 五种和谐类型整合到一个交互工具中
• 色轮上的直观和谐线条，方便理解色彩关系
• 点击式交互，让您自然地探索颜色世界
• 可调节的饱和度和亮度同时影响所有和谐颜色
• 结合教育和实用性色板生成功能

Common Use Cases

色彩理论教育

通过色轮直观地展示不同和谐规则如何创建色彩关系。

快速色板生成

仅需几次点击，即可生成任意类型的和谐色板。

设计探索

通过切换不同和谐类型并旋转色轮来实验不同的颜色组合。

客户演示

向客户展示为什么某些颜色组合有效，通过直观地演示和谐规则。

Technical Guide

该轮是在HTML5 Canvas元素上使用极坐标渲染的。对于每个角度（0-359°），一个扇形是使用arc()函数绘制的，相应的HSL颜色为其赋值。和谐点根据所选的和谐类型计算：互补添加180°，三角添加120°和240°，四边形添加90°/180°/270°，类似添加±30°，分裂-互补添加150°和210°。和谐线连接这些点，并且每个颜色位置都有一个标记点。该轮对点击事件做出响应，将笛卡尔坐标转换为极坐标角度：angle = atan2(y - cy, x - cx)，并将其从弧度转换为度，偏移90°（因为色调0°在顶部）。饱和度和亮度滑块同时影响整个轮的渲染以及所有和谐计算。

Tips & Best Practices

• 1
  直接点击色轮以获得最自然的颜色选择体验
• 2
  尝试使用相同的基础色调但不同的和谐类型来查看色板如何变化
• 3
  降低饱和度可生成更专业、柔和的适合企业设计的色板
• 4
  使用色轮向团队成员或客户解释色彩理论概念
• 5
  类似和谐颜色会聚集在一起；互补和谐颜色则跨越整个色轮--注意这种模式

Related Tools

互补色生成器

生成具有明暗变体的互补色对。

🎨 Color Tools

三元色彩方案

生成三个颜色在色轮上120°相距的三元色彩方案。

🎨 Color Tools

分割互补色方案

生成可调节分割角度的分割互补色板。

🎨 Color Tools

相似色调方案

生成可调整角度和数量的相似色调palette。

🎨 Color Tools

双四色调色板

生成以90°间隔的四种颜色的双四色（矩形）配色方案。

🎨 Color Tools

Frequently Asked Questions

Q 什么是色彩和谐？

色彩和谐指的是基于色轮位置的美观色彩排列。和谐的颜色遵循几何图案（对立、三角形、正方形等），创造出视觉平衡。

Q 我应该选择哪种和谐类型？

类似和谐适合宁静、统一的设计；互补和谐适合高对比度；三角和谐适合生动多样的颜色；分割-互补和谐则在保持对比的情况下减少紧张感；四边形和谐适合丰富复杂的色板。

Q 我可以点击色轮来选择颜色吗？

是的！您可以点击色轮上的任意位置来设置基础色调，相应的和谐点会自动调整以显示基于所选和谐类型的相关颜色。

About This Tool

色彩和谐轮 is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.