色轮
免费在线使用 色轮 无需安装即可使用工具
关于色轮
这个工具在 HTML 画布上渲染一个由 360 个分段组成的色相环，允许你通过点击或拖拽色环来选择色相。饱和度和亮度通过滑块设置，所选颜色会作为色块显示，并提供可复制的 HEX、RGB 和 HSL 字符串。Reset 按钮会将色相恢复为 0、饱和度恢复为 100、亮度恢复为 50。
如何使用
1. 点击或拖拽彩色环内部以设置色相；色环会以当前的饱和度和亮度绘制。 2. 使用滑块或数字输入调整 Hue（0-360）、Saturation（0-100）和 Lightness（0-100）。 3. 观察 Preview 色块和色环上的指示器实时更新。 4. 使用 Color Values 卡片中的按钮复制 HEX、RGB 或 HSL。 5. 点击 Reset 返回默认值。
色轮行为与指示器
色轮是一个 260px 的画布，按设备像素比绘制以保证清晰度，外部是色相环，内部为空。指针事件会被捕获，因此拖动时会跟踪光标；在内部空洞或外部边缘的点击会被忽略。一个圆形指示器位于所选色相处，并以当前颜色填充。色相由指针相对于圆心的角度推导得出，0deg 位于顶部。饱和度和亮度会改变色环每个分段的颜色，而不会改变几何形状。
▶为什么点击色轮的中心没有任何反应？
只有彩色的外环是可交互的。内部半径（减去容差）或外部半径之外的指针事件都会被忽略，因此空心中心的点击不会产生效果。
▶我可以在色轮上选择饱和度或亮度吗？
不能。色轮只能通过角度选择色相。饱和度和亮度必须使用色轮下方的滑块或数字输入来设置。
▶为什么拖动有时不能平滑地跟随我的光标？
已启用指针捕获，因此拖动会延续到画布之外，但只有当指针处于色环的径向范围内时色相才会更新；过于靠近中心或过于靠外的位置会被忽略。
▶我可以复制哪些颜色格式？
HEX（大写）、RGB 格式为 `rgb(r, g, b)`、HSL 格式为 `hsl(h, s%, l%)`。每种格式在 Color Values 卡片中都有各自的 Copy 按钮。
如果这个工具对你有帮助的话，请考虑请我喝杯咖啡。
请给我买杯咖啡吧。