颜色选择器与转换器

在 HEX、RGB 和 HSL 格式之间转换颜色。选择任意颜色并即时复制 CSS 值。

点击色块打开原生颜色选择器，或在下方编辑数值。

#3B82F6
rgb(59, 130, 246) • hsl(217, 91%, 60%)

HEX

RGB

HSL

CSS 值

HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)

如何使用颜色转换器

  1. 1.点击色块打开原生颜色选择器。
  2. 2.或直接在 HEX 字段中输入。
  3. 3.调整 RGB 或 HSL 滑块微调颜色。
  4. 4.点击复制复制任意格式的 CSS 值。

常见问题

HEX、RGB 和 HSL 有什么区别？

HEX 是 6 位十六进制表示法。RGB 指定红、绿、蓝值（0-255）。HSL 是色相（0-360）、饱和度（0-100%）、亮度（0-100%）。

什么时候用 HSL 而不是 RGB？

HSL 在调整亮度和鲜艳度时更直观。需要更亮？增加 L。需要更柔和？减少 S。

能输入 RGB/HSL 转换为 HEX 吗？

可以 — 编辑 RGB 输入或滑块，所有格式实时更新。

为什么转换后的 HSL 看起来略有不同？

HEX/RGB 使用整数，而 HSL 涉及浮点运算。四舍五入导致微小的不可察觉的差异。