取色器与颜色转换器 — RGB、HEX、HSL
从屏幕任意位置吸取颜色，或在 HEX、RGB 和 HSL 之间即时转换。
提示：在 Chrome 或 Edge 中，这里会出现“从屏幕取色”吸管工具——它可以拾取屏幕上任意像素的颜色，甚至是浏览器之外的。
#071E93rgb(7, 30, 147)hsl(230, 91%, 30%)支持 HEX（#RGB 或 #RRGGBB）、rgb()、hsl() 或纯“r, g, b”——最多 500 行。每一行都会以 HEX、RGB 和 HSL 显示；不是颜色的行会被标出，其余行照常转换。
发现问题，或者觉得哪里可以更好？每条消息我们都会阅读，并尽快修复。
在 HEX、RGB 和 HSL 之间即时转换任意颜色。可以直接在取色板上选色、粘贴 HEX 代码、输入 RGB 或 HSL 数值——也可以用屏幕吸管吸取显示器上任意位置的像素，哪怕是在其他应用里。所有格式实时同步，每种都附有可直接复制的 CSS 字符串。
手上有一整套配色？把颜色列表按每行一个粘贴到批量框中，每一行都会转换成 HEX、RGB 和 HSL，汇总在一张表里，还可以下载为 CSV。
使用方法
- 用可视化取色器选色，或在任意字段（HEX、RGB 或 HSL）中输入——也可以点击“从屏幕取色”，再点击显示器上的任意像素，浏览器之外的也行。
- 其他格式会立即同步更新。
- 点击所需格式旁的“复制”——数值可直接粘贴到 CSS 中。
- 要转换大量颜色，把它们按每行一个粘贴到转换器下方的批量框中，再将表格下载为 CSV。
常见问题
HEX、RGB 和 HSL 有什么区别？
它们用不同方式描述同样的颜色。HEX（#071E93）写法紧凑，是网页上最常用的表示法。RGB（rgb(7, 30, 147)）表示红、绿、蓝三个分量——需要用 rgba() 加透明度时很方便。HSL（hsl(229, 91%, 30%)）表示色相、饱和度和亮度——调整颜色时最直观，比如把颜色调亮或调得更柔和。
CSS 中什么时候该用 HSL？
需要颜色变体时用 HSL：固定色相和饱和度、只改变亮度，就能得到品牌色一致的浅色和深色版本——比猜 HEX 值容易得多。
支持 3 位 HEX 代码吗？
支持——#fff 或 #1a9 这样的简写会自动展开为完整的 6 位形式（#ffffff、#11aa99）。
RGB 转 HEX 是精确的吗？
是的——HEX 就是用十六进制写的 RGB，两者双向转换都是精确的。HSL 往返转换可能因舍入产生 ±1 的偏差，实际上肉眼无法察觉。
可以一次转换多个颜色吗？
可以。在“批量转换”框中每行粘贴一个颜色，最多 500 个——HEX（#fff 或 #071E93）、rgb()、hsl() 或纯“r, g, b”三元组都可以。每一行都会以表格列出其 HEX、RGB 和 HSL 值以及色块；不是颜色的行会被标出，但不影响其余行，点击“下载 CSV”即可保存整张表。
屏幕吸管是怎么工作的？
它使用浏览器原生的 EyeDropper API：点击按钮后，光标会变成放大镜，点击任意像素——无论是本页面、其他标签页，还是完全不同的应用程序——即可获取该像素的准确颜色。不会录制或上传任何内容；API 只返回你点击的那一个颜色。Chrome 和 Edge 支持；Firefox 和 Safari 尚未支持。
速查：三种颜色表示法
• HEX（#071E93）——六位十六进制数字，每个通道两位。最紧凑的表示法，也是大多数设计工具和 CSS 代码库的默认写法。
• RGB（rgb(7, 30, 147)）——每个通道取值 0–255。需要 Alpha 透明度时，使用 rgba() 或现代的 rgb(r g b / a) 语法。
• HSL（hsl(229, 91%, 30%)）——色轮上的色相（0–360°）、饱和度和亮度。最便于人工调整的表示法：改一个数字，就能得到同一色相更亮、更暗或更柔和的版本。
一个实用的工作流程：用 HEX 定义品牌色，用 HSL 调整（通过改变亮度得到浅色和深色），当某个库或 canvas API 需要数值通道时再用 RGB。