图片取色

图片取色器

点一个像素拿它的 HEX 色值,或者让工具把整张图的主色抽成一套配色。

图片取色

☞ 全程在你的浏览器中运行 —— 不会上传任何图片

把图片拖到这里

或点击浏览 —— PNG、JPG、WebP 或 GIF

读颜色的两种方式

要么是那一个像素,要么是整张图的颜色

指着一个像素问和指着一张图问,是两个问题。吸管回答前一个:点哪里就给哪里的值,不取整也不平均,HEX 给 CSS 用,RGB 给设计软件用,HSL 留给要微调色相或明度的时候。按住拖动时读数跟着指针走,比一次点中两像素宽的细线容易得多。

调色板回答后一个。每个像素都被归到少数几个代表色上,每个色块旁边标着它占整张图的比例 —— 所以排序反映的是这张图实际由什么构成,而不是哪个颜色最扎眼。这些代表色接近你看到的颜色,但不一定逐像素地存在,所以要那个字面值时,吸管仍然在那儿。

三步

如何从图片里取颜色

01

把图片拖进来

PNG、JPG、WebP 和 GIF 都在你的浏览器里直接读取。品牌页的截图、还没发布的照片,都留在你自己的机器上。

02

点一下取单个颜色

HEX、RGB、HSL 三种写法一次给全。复制会把 HEX 放进剪贴板;要取的地方很小时,按住鼠标拖过去。

03

或者直接要整套配色

选好要几个颜色,整张图就会被归纳成那么多个,并按各自占的面积排序。点色块复制单个,也可以一次复制整份清单。

快速解答

图片取色常见问题

取到的是那个像素的准确值吗?

是。取色时图片保持原始分辨率,所以拿到的是文件里存的那个值,而不是预览缩放混合出来的颜色。只有大到超过浏览器画布上限的图才会先等比缩小。

色块旁边的百分比是什么意思?

这个颜色占整张图的比例。每个像素都被归到最近的色块上数一遍,所以排序反映的是真实占比 —— 一小块高饱和的点缀色不会压过背景。

为什么调色板里的颜色和我看到的略有出入?

调色板里的颜色是一整组相近像素的代表平均值,所以它未必在图里逐像素地存在。需要某一点的字面值时,请用吸管点它。

透明的 PNG 会怎样?

透明像素不参与调色板。不排除的话,透明底上的一个 logo 抽出来会是一片白 —— 那是画布的底色,你的图里根本没有。

支持哪些格式?

PNG、JPG、WebP 和 GIF,最大 25 MB。动图 GIF 按第一帧读取。iPhone 的 HEIC 暂不支持,请先转换再来取色。

能一次复制整套配色吗?

能。「复制全部」会把所有 HEX 每行一个放进剪贴板,可以直接粘进样式表、设计文件或聊天窗口。

只用键盘能用吗?

取单个像素需要指针,但调色板的色块是真正的按钮:Tab 过去按回车就能复制它的色值。所以一张图的主色不用鼠标也拿得到。

我的图片会被上传吗?

不会。图片在你的浏览器里解码和统计,什么也不会发出去。这个工具里没有服务器可以接收图片。

免费吗?

免费 —— 无水印,也不用注册。