颜色设置

支持 HEX、RGB(A)、HSL(A)，例如 #136CE9 或 hsl(215, 85%, 49%)。

调整颜色后即可查看结果。

颜色预览与格式

颜色预览
HEX#136CE9
RGBrgb(19, 108, 233)
HSLhsl(215, 85%, 49%)
白底文字对比度4.83 : 1普通文字 AA 达标
黑底文字对比度4.35 : 1普通文字 AA 未达标

依据 WCAG 2.x：普通文字 AA ≥ 4.5，AAA ≥ 7。透明颜色按对应背景合成后计算。

最近使用

颜色选择器

选择颜色或输入色值，调整透明度并查看 HEX、RGB、HSL 表示，以及黑白背景下的文字对比度，支持复制颜色与最近用色，方便准备页面和设计配色。

整理：喜爱工具箱 · 更新于 · 示例内容仅供排版参考，请替换为实际信息。

使用说明

三步完成操作

  1. 01 · 输入颜色

    使用取色器或填写 HEX、RGB(A)、HSL(A) 颜色代码。

  2. 02 · 调整透明度

    拖动不透明度滑杆，并查看白底与黑底对比度。

  3. 03 · 复制色值

    按需要复制格式，或从最近使用的颜色快速切换。

常见问题

使用前先了解这些

支持透明颜色吗？

支持四位、八位 HEX 及 rgba()、hsla()；RGB 与 HSL 支持逗号格式，也支持 rgb(19 108 233 / 50%) 这样的空格与斜杠格式。

对比度如何判断？

依据 WCAG 2.x 相对亮度公式，普通文字 AA 要求至少 4.5:1，AAA 要求至少 7:1。透明色先与指定背景合成。