数据不发送至服务器 — 所有处理均在浏览器中完成
HEX
RGB
HSL
HSV
CMYK
LAB
OKLCH
HSV 仅供参考。CSS 没有 hsv() 函数 — 请改用 HSL。
CSS 变量
--color-primary: #06d6a0;Tailwind 类
bg-[#06d6a0]Tailwind v4 @theme
@theme {
--color-primary: oklch(78% 0.16 167);
}颜色转换器是一个免费的在线 HEX、RGB、HSL、OKLCH 等色彩空间互转工具。包含取色器、图片调色板提取、WCAG 对比度检查和色盲模拟。完全在浏览器中运行。
关于颜色转换
本颜色工具支持 7 种色彩空间互转、生成配色方案、检查对比度（WCAG 和 APCA）、模拟色觉缺陷，以及从图片中提取调色板。如需十六进制计算，请参见[进制转换器](/numbase)；如需图片处理，请参见[图片压缩](/image)。
色彩空间
HEX — 紧凑的 6/8 位 RGB 表示法，CSS 的默认格式。
RGB — 加色三原色，值域 0–255，直接对应屏幕像素。
HSL — 色相/饱和度/亮度。比 RGB 更直观，便于人工调整。
HSV — 色相/饱和度/明度。设计工具中常用，但 CSS 没有对应的函数。
CMYK — 减色三原色，用于印刷。从 RGB 转换时为近似值。
LAB — 感知均匀色彩空间；相等的数值距离 ≈ 相等的视觉差异。
OKLCH — 现代感知均匀色彩空间；Tailwind v4 和 CSS Color Module Level 4 推荐使用。
对比度（WCAG vs APCA）
WCAG 2.1 使用亮度比（1:1 至 21:1），以 AA/AAA 作为达标阈值。它被广泛采用，但未能完全考虑小号文本和深色模式下的感知差异。
APCA 是 WCAG 3 的候选方案，采用感知极性感知的 Lc 评分。对于细体或小号文本的可读性，它与实际体验的相关性更好。
使用技巧
- 使用取色器可从屏幕上的任意像素拾取颜色（仅限 Chromium 内核浏览器）。
- 将图片拖入「配色」标签页，可通过中位切割量化算法提取 6 种主色调。
- Tailwind v4 使用 OKLCH 输出颜色以实现感知均匀过渡 —— 复制 @theme 代码块即可与此工作流保持一致。
可以从图片中提取颜色吗？
可以。将图片拖放到调色板提取区域即可获取主要颜色。还可以模拟色觉缺陷（红色盲、绿色盲、蓝色盲）。