颜色转换器
在 HEX、RGB、HSL 格式之间相互转换，并即时查找最接近的 Tailwind CSS 类名。
indigo-500
最接近的 Tailwind 颜色类
即时转换 HEX、RGB、HSL 与 Tailwind 颜色
在不同颜色格式之间切换是构建 UI 时的常见摩擦点。Zolkit 颜色转换器支持 HEX、RGB 和 HSL 双向转换，还能自动查找最近的 Tailwind CSS 颜色类名，让你从设计工具的十六进制代码到工具类一步完成。
三格式同步
编辑任意格式（HEX、RGB 或 HSL），其他格式即时同步更新，始终保持一致。
Tailwind 颜色匹配
使用 RGB 欧氏距离，在完整 22 色系 Tailwind v3 调色板中自动找到最接近的颜色类名。
实时色块预览
大号拾色器提供直观的视觉预览，调整数值时即时显示当前颜色效果。
一键复制任意格式
每个格式卡片均提供一键复制功能，可复制 HEX 字符串、rgb() 函数、hsl() 函数或 Tailwind 类名。
完全私密
所有颜色计算均在浏览器本地完成，数据不会发送至任何服务器。
永久免费
无需账号，无使用限制，无付费墙，颜色转换完全免费。
如何转换颜色
- 1
点击拾色器，或在任意格式输入框（HEX、RGB 或 HSL）中直接输入数值。
- 2
其他格式输入框自动更新，Tailwind 卡片显示最接近的工具类名。
- 3
点击任意卡片上的复制按钮，将对应格式复制到剪贴板。
常见问题
这个工具支持哪些颜色格式？
支持 HEX（6 位十六进制，如 #3b82f6）、RGB（每通道 0–255）、HSL（色调 0–360°，饱和度和亮度 0–100%）以及 Tailwind CSS 类名。编辑任意格式，其余格式即时更新。
Tailwind 颜色匹配是如何工作的？
工具使用 RGB 欧氏距离，将输入颜色与 Tailwind v3 调色板中全部约 242 种颜色（22 个色系 × 每系 11 个色阶）进行比对，返回最接近的类名，例如 'blue-500'。
Tailwind 匹配结果一定精确吗？
不一定。如果输入颜色恰好是 Tailwind 调色板中的颜色，则精确匹配；对于任意颜色，返回的是最近邻，视觉上可能存在偏差。Tailwind 卡片旁的色块可帮助直观对比。
调色板来自哪个版本的 Tailwind？
查找表使用 Tailwind CSS v3 默认调色板，包含全部 22 个色系（slate、gray、zinc、neutral、stone、red、orange、amber、yellow、lime、green、emerald、teal、cyan、sky、blue、indigo、violet、purple、fuchsia、pink、rose），每系 11 个色阶（50 至 950）。
可以直接输入 HSL 值吗？
可以。点击 H、S 或 L 任意输入框并输入数值。色调范围为 0–360 度，饱和度和亮度为 0–100%，输入后 HEX 和 RGB 字段会立即同步更新。
离线也能使用吗？
页面加载后可以离线使用。所有转换逻辑和 Tailwind 查找表均打包在 JavaScript 中，颜色转换过程不会发起任何网络请求。