Color Picker

本地 color-picker 思路，在浏览器本地从手动输入、屏幕或图片像素中取色，并实时输出 HEX、RGB、HSL、HSV、CMYK 与 CSS 值。

Color Picker

Color Picker 可在浏览器本地从手动输入、屏幕或图片像素中取色，并即时输出 HEX、RGB、HSL、HSV、CMYK 与 CSS 颜色值，适合前端开发、设计交付、主题配置和颜色校验。

如何使用？

  1. 直接选择颜色或调节透明度。
  2. 若浏览器支持，可使用屏幕取色器从界面中抓取颜色。
  3. 也可以上传图片并点击像素位置进行采样。
  4. 复制需要的颜色格式用于 CSS、设计稿或配置文件。

工具特性

  • 支持手动选色、屏幕取色与图片取色
  • 输出 HEX、RGB、HSL、HSV、CMYK 与 CSS 值
  • 浏览器本地处理，不上传图片

为什么使用这个工具？

  • 快速统一前端与设计使用的颜色值
  • 从截图、UI 界面或图片中直接还原颜色
  • 便于主题系统和样式调试中的颜色校验

相关工具

GIF 制作

将多张静态图片或视频片段转换为动态 GIF。

图片尺寸调整

批量调整图片宽高，支持按像素或百分比缩放、锁定比例和导出下载。

图片转 ICO

将图片转换为 favicon 或应用图标常用的 ICO 文件，支持多尺寸打包。

SVG 转 PNG/JPG

将 SVG 导出为 PNG 或 JPG，支持自定义尺寸、背景色和本地下载。

SVG 优化器

本地 SVG optimizer 思路，在浏览器本地压缩 SVG 代码、清理元数据并输出优化版本。

EXIF 查看器

本地 exif-viewer 思路，在浏览器本地读取图片中的 EXIF、GPS、相机和拍摄参数。

图片元数据清理

本地 image-metadata-cleaner 思路，在浏览器本地移除 JPEG、PNG、WebP 中的 EXIF、XMP、ICC 等元数据。

图片调色板提取

本地 image-palette-extractor 思路，从图片中提取主色、占比和调色板，并导出 HEX、CSS 或 JSON。

Color Converter

本地 color-converter 思路，在浏览器本地把 HEX、RGB、HSL、HSV、HWB、LAB、LCH、CMYK 与 CSS 关键字做双向颜色转换，并支持 Alpha 通道。

Color Contrast Checker

本地 color-contrast-checker 思路，在浏览器本地检查前景色与背景色的 WCAG 对比度，并判断普通文字和大号文字的 AA / AAA 通过情况。

CSS Gradient Generator

本地产品组织方式，在浏览器本地可视化生成 linear-gradient、radial-gradient、conic-gradient，并实时复制 CSS 渐变代码。

CSS Box Shadow Generator

本地产品组织方式，在浏览器本地可视化调节 box-shadow 参数，实时预览卡片阴影并复制 CSS 代码。

HTML Color Names

本地产品组织方式，在浏览器本地浏览和搜索 HTML / CSS 命名颜色，并复制名称、HEX、RGB。

favicon 生成器

生成网站常用 favicon 资源、site.webmanifest 和 HTML 引用片段。

Gemini 水印去除

在浏览器本地去除 Gemini 图片右下角可见水印，支持批量处理与下载。

图片转 AVIF

批量将 PNG、JPG 等图片转换为 AVIF，支持质量、缩放比例和 ZIP 下载。

PNG 压缩器

压缩 PNG 文件体积并保留 PNG 输出，支持缩放、减少颜色数量与 ZIP 下载。

图片转 WebP

批量将 PNG、JPG 等图片转换为 WebP，支持质量与缩放比例调整、预览和 ZIP 下载。