颜色取值

在线颜色取值工具，支持HEX、RGB、HSL、HSV、CMYK多种颜色格式互转。提供取色器、RGB滑块调色、颜色历史记录、预设色板，一键复制颜色值，适用于UI设计、前端开发、配色方案选择等场景。

当前颜色

#6366F1

感知亮度

132

相对亮度

0.265

推荐文字色

白色

1 颜色选择

#6366F1

点击选择颜色

R 99

G 102

B 241

2 颜色格式

HEX

#6366F1

RGB

rgb(99, 102, 241)

HSL

hsl(239, 84%, 67%)

HSV

hsv(239, 59%, 95%)

CMYK

cmyk(59%, 58%, 0%, 5%)

对比度 (WCAG)

白色背景对比度

3.83

AA Large

黑色背景对比度

5.48

白色背景上的文字示例 AaBbCc 123

黑色背景上的文字示例 AaBbCc 123

历史记录 & 预设色板

功能特性

可视化取色器

基于浏览器原生取色器，点击预览区即可打开系统级颜色选择面板，支持精确选取任意颜色。

RGB滑块调色

提供R、G、B三通道独立滑块，实时预览颜色变化，适合需要精确调整单一通道的场景。

多格式互转

支持HEX、RGB、HSL、HSV、CMYK五种颜色格式实时互转，任意输入方式都会同步更新所有格式。

一键复制

每种颜色格式都配备独立的复制按钮，也可一键复制全部格式，方便粘贴到代码或设计软件中。

WCAG对比度检测

自动计算颜色与白色/黑色背景的对比度比值，标注WCAG等级（AA/AAA），辅助无障碍设计决策。

预设色板

内置Tailwind CSS色板、经典颜色、网页安全色三套预设色板，点击即可快速选取常用颜色。

使用说明

如何使用颜色取值工具？

点击颜色预览区域，打开浏览器原生取色器选择颜色。
在HEX输入框中直接输入6位十六进制颜色代码（如 6366F1），点击「应用」按钮。
拖动R、G、B滑块，实时调整颜色，适合精确控制单个颜色通道。
点击「随机颜色」按钮，生成随机颜色供参考。
在下方颜色格式区，点击对应格式右侧的「复制」按钮，将颜色值复制到剪贴板。
从预设色板或历史记录中点击颜色块，可快速恢复之前使用过的颜色。

颜色格式说明

HEX：十六进制颜色代码，格式 #RRGGBB，如 #6366F1。Web开发中最常用的格式。
RGB：红绿蓝三通道颜色值，格式 rgb(r, g, b)，每个通道取值0-255。
HSL：色相、饱和度、亮度，格式 hsl(h, s%, l%)。色相0-360度，饱和度和亮度0-100%。
HSV：色相、饱和度、明度，格式 hsv(h, s%, v%)。与HSL类似但明度计算方式不同。
CMYK：青、品红、黄、黑四色印刷模式，格式 cmyk(c%, m%, y%, k%)，主要用于印刷设计。

WCAG对比度是什么？

WCAG（Web Content Accessibility Guidelines）对比度比值用于衡量文字与背景颜色的视觉差异。比值范围从1:1（无差异）到21:1（最大差异，黑底白字）。WCAG标准要求：正常文字对比度不低于4.5:1（AA级）或7:1（AAA级），大号文字不低于3:1（AA级）。本工具自动计算并标注当前颜色在白色和黑色背景上的对比度等级，帮助开发者满足无障碍设计要求。

常见问题

颜色取值工具是免费的吗？

是的，本工具完全免费，无需注册登录。所有颜色转换和计算均在浏览器本地完成，不涉及服务器交互，使用流畅且隐私安全。

HEX和RGB有什么区别？

HEX和RGB是同一种颜色模型（RGB）的两种不同表示方式。HEX使用十六进制表示（如 #FF5733），更简洁，广泛用于CSS和设计软件；RGB使用十进制表示（如 rgb(255, 87, 51)），更直观易读。两者可以互相转换，表示的颜色完全相同。

HSL和HSV有什么区别？

HSL（色相、饱和度、亮度）和HSV（色相、饱和度、明度）都是基于RGB的颜色模型，区别在于对"亮度"的定义不同。HSL中的亮度从纯色到白色和黑色两端对称变化；HSV中的明度只从纯色到黑色变化。HSL更适合CSS设计，HSV更常用于图形软件中的颜色选择器。

什么是网页安全色（Web Safe Colors）？

网页安全色是指早期256色显示器时代，确保在不同操作系统和浏览器上显示一致的216种颜色。这些颜色的R、G、B三个通道值只取00、33、66、99、CC、FF六个值。现代显示器已支持真彩色，网页安全色主要作为历史参考和快速选色使用。

如何选择适合的文字颜色？

根据背景颜色的亮度自动推荐文字颜色：当背景感知亮度大于125时推荐使用黑色文字，否则推荐白色文字。同时，本工具提供WCAG对比度检测，建议确保文字与背景的对比度比值达到4.5:1以上（AA级标准），以保证文字的可读性和无障碍性。

颜色历史记录会保存吗？

颜色历史记录在当前会话中保持有效，最多保存12个最近使用的颜色。关闭或刷新页面后历史记录会清空。如需长期保存特定颜色，建议复制HEX值到笔记或代码中。