Check text contrast early
Body text needs at least 4.5:1 against its background for WCAG AA, large text 3:1. The checker suggests the nearest color that passes.
嘉Jaykou工具台 · 颜色选择器 在你的浏览器中运行
每日 免费 3 次
在线颜色选择器挑选、转换、检查并导出颜色。
从色轮、屏幕或任何图片中选择一种颜色，并将其复制为 HEX、RGB、HSL、HSV、OKLCH 或 CMYK 格式。
构建和声与色阶，检查文本对比度，用色盲视角查看，并导出可直接粘贴的代码。
100% 本地处理游客每日 3 次 · 无水印注册送 20 积分
游客每日 3 次 无需上传 无水印
结果会显示在这里
HEX#19e65e
RGBrgb(25, 230, 94)
HSLhsl(140, 80%, 50%)
取色器
选择、微调、保存到色板，可导出 JSON / CSS 变量 / Tailwind 配置。
颜色
色相
饱和度
明度
点「加入色板」保存当前颜色
颜色和图像都留在你的设备上。
使用说明
颜色选择器怎么用？4 步就能上手
颜色选择器用来取色和换算色值：点一下就能拿到 HEX、RGB、HSL 等多种格式。 免费在线颜色选择器：可从色轮、屏幕或照片中选择颜色，转换 HEX、RGB、HSL、OKLCH 和 CMYK，创建调色板，检查对比度并导出代码。
1
选择颜色
在色轮上拖动取色，或从图片、屏幕截图中点击任意像素拾取颜色。
2
微调色调
拖动滑块或直接输入数值，精确调整色相、饱和度与明度。
3
查看色值
界面会同时给出 HEX、RGB、HSL、HSV、OKLCH 等格式的数值。
4
复制使用
点击任一色值即可复制，粘贴到设计工具或代码里使用。
· 点击色值区域即可一键复制到剪贴板。· 浅色背景上建议使用对比度更高的深色文字。
小提示
选择颜色的技巧
一些使调色板更易使用和更易阅读的习惯。
Use OKLCH for even scales
OKLCH lightness matches what eyes see, so a scale made in OKLCH steps evenly from light to dark without muddy middles.
Don’t rely on color alone
Red and green look alike to many people. Preview your palette in the color-blindness tab and add labels or icons where meaning matters.
Average when picking from photos
Photos are noisy up close. A 3×3 or 5×5 sample gives the color you see rather than a single stray pixel.
Start a palette from an image
Open a photo you like and extract 5 to 8 colors. K-means finds the main colors; median cut keeps small accents.
CMYK here is an estimate
Print colors depend on paper and press. Use the CMYK value as a starting point and check it with your printer’s profile.
嘉Jaykou工具台
这些也在你的浏览器里完成
无需注册即可试用，游客每日 3 次免费。所有处理都在你的设备上完成，文件不会被上传。
- 490 个免费工具
- 图片 · 视频 · PDF · 文本
- 每日免费额度
所有工具每天都有免费额度。 游客每日 3 次免费，注册再送 20 积分。文件不上传，处理全在你的设备上完成。
颜色选择器常见问题
我如何从图像中选择颜色？
打开图像选项卡，选择一张照片或截图（或粘贴一张），然后点击或轻触任意像素。放大镜会显示你所在的具体像素，你可以对 3×3 到 11×11 的区域进行平均处理。图片在你的浏览器中读取，并保留在你的设备上。
我可以从屏幕上的任何地方选择颜色吗？
是的，在支持吸管工具的浏览器中（桌面上的 Chrome、Edge 以及其他 Chromium 浏览器）。点击吸管工具，然后点击屏幕上的任意像素点，即使是在浏览器窗口之外。在其他浏览器中，请截图并将其粘贴到图像标签中。
我如何将 HEX 转换为 RGB？
在颜色字段中输入或粘贴 HEX 代码，RGB 数值会显示在下面，准备复制。要一次转换多种颜色，请在转换标签中每行粘贴一个，并选择输出格式。
支持哪些颜色格式？
HEX（3、4、6 和 8 位）、RGB、HSL、HSV/HSB、HWB、OKLCH、OKLab 和 CMYK，以及所有 CSS 颜色名称。您可以粘贴带有或不带函数名称的值，例如“255, 87, 51”。
什么是OKLCH，为什么要使用它？
OKLCH 通过感知亮度、色度（色彩丰富度）和色相来描述颜色。相等的步长看起来相等，因此它非常适合用于阴影刻度和一致的调色板，并且在现代 CSS 中被支持为 oklch()。
对比度检查器是如何工作的？
它计算文本与背景之间的 WCAG 2 对比度，并显示其是否符合普通文本、大号文本以及界面元素的 AA 和 AAA 标准。它还显示 WCAG 3 草案中的 APCA 亮度对比度 (Lc)，并建议最接近通过的颜色。
我如何创建一个颜色调色板？
选择一种基础颜色，然后使用“和谐色”进行互补色、三方色等配色，或使用“色阶”获得色调、明暗及50–950的色彩范围。你也可以从照片中提取调色板。保存收藏并将它们导出为代码。
我可以导出用于 Tailwind、SwiftUI 或 Android 的颜色吗？
是的。导出选项卡将您的调色板写入为 CSS 变量、SCSS、Tailwind v4 @theme 或 v3 配置、SwiftUI、UIKit、Android colors.xml、Jetpack Compose、JSON、GIMP 调色板或普通的十六进制列表。您可以复制它或下载文件。
Is this color picker free?
Yes. It is free with no sign-up, no limits and no watermark, and everything runs in your browser.
更多像这样的免费工具
免费工具
挑选、转换、检查并导出颜色
免费、私密，在浏览器里即刻可用。