可视化取色
拖动饱和度/明度区域与色相条，也可以直接输入 HEX 代码。
取色区域 饱和度 × 明度
0° 红60° 黄120° 绿180° 青240° 蓝300° 紫360°
当前颜色 点击代码右侧复制
COLOR
#C2410C
HEX
RGB
rgb(194, 65, 12)
HSL
hsl(17, 88%, 40%)
配色方案
我的收藏
保存在本机浏览器还没有收藏颜色，点击上方「收藏当前颜色」添加。
什么是在线颜色选择器
这是一个运行在浏览器里的可视化取色工具。左侧方形区域表示饱和度与明度，横向拖动改变饱和度，纵向拖动改变明度；下方色相条用于选择红、黄、绿、青、蓝、紫等色相。右侧会实时显示当前颜色以及对应的 HEX、RGB、HSL 代码。
除了取色，工具还会基于当前颜色生成类似色、互补色、三角配色和单色阶梯，方便为网页、海报或品牌视觉寻找搭配。收藏的颜色只保存在你当前浏览器的本地存储中，不会上传服务器。
实时颜色代码
同步显示 HEX、RGB、HSL，并支持逐项复制。
配色方案
一键生成类似色、互补色、三角配色与单色阶梯。
本机收藏
收藏常用颜色，刷新后仍在；数据只保存在本地浏览器。
使用方法
- 拖动左侧方块选择饱和度与明度，拖动下方色相条选择颜色倾向。
- 在右侧查看 HEX、RGB、HSL，点击每行右侧按钮复制；也可以直接修改 HEX 输入框。
- 在「配色方案」中切换模式，点击任意色块即可把该颜色设为当前颜色；需要时收藏到本机。
常见问题
怎么选择颜色？
拖动左侧方形取色区域可以调整饱和度与明度，拖动下方色相条可以选择红、黄、绿、青、蓝、紫等色相；也可以直接在 HEX 输入框填写颜色代码。
收藏的颜色保存在哪里？
收藏只保存在你当前浏览器的本地存储中，不会上传服务器。清理浏览器数据或更换设备后收藏会丢失。
配色方案是怎么生成的？
配色基于当前颜色的 HSL 色相，按固定角度偏移生成类似色、互补色或三角配色；单色阶梯则保持色相与饱和度，调整明度。
支持透明度（Alpha）吗？
当前版本只处理不透明颜色，输出 6 位 HEX、rgb 与 hsl，不包含 Alpha 通道。
和颜色代码转换工具有什么区别？
颜色选择器侧重可视化取色与配色，不包含 CMYK 与印刷专色匹配；需要 HEX、RGB、HSL、HSV、CMYK 全部格式时可使用颜色代码转换工具。
颜色数据会上传到服务器吗？
不会。取色、转换和配色都在浏览器本地完成，颜色代码不会上传。