可视化色轮
通过色相、饱和度和明度滑块查看色轮位置，快速确认当前主色。
常用配色自动生成
自动生成互补色、三角色、相邻色和分裂互补色，适合快速延展设计方案。
色值可复制
每个色块都提供 HEX、RGB 和 HSL，点击即可复制常用色值。
Color Wheel · 浏览器本地
拖动 HSL 参数，立即生成常用配色关系
色相、饱和度、明度和配色计算都在当前浏览器内完成，不会上传服务器。适合 UI 主题色、海报色彩和品牌辅助色快速取样。
当前 HEX
#338FEB
色相
210°
饱和度
82%
明度
56%
#338FEBrgb(51, 143, 235)hsl(210 82% 56%)
已生成默认色轮配色。 点击任意色块可复制 HEX。
工具使用说明
怎么用 色轮工具
调整 HSL 参数
拖动色相、饱和度和明度，先确定当前主色。
查看配色关系
对照互补色、三角色、相邻色和分裂互补色，快速判断可用组合。
复制色值使用
点击色块复制 HEX，或复制全部色值到设计稿、CSS 变量和品牌色板。
功能说明
这个工具解决什么问题
适合快速找主色和辅助色
在浏览器本地查看色轮、调整 HSL 颜色并生成互补色、三角色和相邻配色。不会上传服务器。
做界面、海报、图标和品牌延展时，先用色轮确定配色关系，比凭感觉试色更稳定。
为什么默认本地计算
色轮和配色关系是确定性计算，不需要第三方服务。
当前页面只在浏览器本地计算色值，不上传你的设计草稿或使用记录。
常见问题
关于 色轮工具，用户常问这些
色轮工具 是本地生成吗？
是。HSL 调整、配色生成和复制都在当前浏览器内完成。
支持哪些配色关系？
当前提供基准色、互补色、相邻色、三角色和分裂互补色。
能复制 CSS 色值吗？
可以。可以复制单个 HEX，也可以复制整组色值。
颜色会上传服务器吗？
不会。当前工具不需要服务端参与，所有颜色计算都在浏览器本地完成。