颜色选择器与调色板提取器——从图片中选择颜色
上传任意照片,点击选择像素颜色(十六进制 / RGB / HSL),或自动提取主色调色板。下载为JSON或CSS变量。
投放一张图片以提取调色板
关于Color Picker
用每通道4位分桶法将你的图像量化成要求数量的主导色,然后按频率排序。它完全运行在浏览器中——你的图片永远不会离开你的设备。
Frequently Asked Questions
上传任意JPG、PNG、WebP或GIF,点击显示图像的任意位置——光标下方的精确像素会被采样,并以HEX、RGB和HSL形式显示,每种格式均可一键复制。非常适合搭配品牌颜色、从照片中试用样品,或从设计样板中提取点缀色调。
usage图像在最长边被下采样到320像素,然后每个像素按每个通道的前4位分入桶。最密集的桶会被平均回全8位色彩,按频率排序,然后返回为你的调色板。结果通常是5到24种主导色彩,视觉上总结了图像。
technical是的。下载按钮产生两种格式:一个是 CSS 变量块,可以粘贴到 :root 选择器(--color-1, --color-2...),另一个是包含每种颜色的十六进制、RGB 分量和权重百分比的 JSON 文件。两种格式都能干净利落地集成到设计标记、Tailwind配置和调色板库中。
features不——颜色选择和调色板提取完全在浏览器中通过HTML画布API完成。图片会留在你的设备上,这使得该工具对未发布的产品照片、草稿和品牌资产的保密协议(NDA)是安全的。
privacy对于品牌识别来说,5-8色是最佳选择——它捕捉了主导主题,同时不稀释点缀选择。对于数据可视化,我们建议使用10-16种颜色,这样你就有足够的分类色调。滑块可以让你在5到24之间选择。
tipsalpha低于128的像素被忽略,因此透明背景不会用“背景”色彩污染调色板。这使得图像色彩选择器特别适合产品剪纸、贴纸艺术和孤立主题。
technicalHEX(#RRGGBB)是最紧凑的,是CSS、Figma和Sketch默认使用的。RGB显示从0到255的三个分量值——在程序化处理图像数据时非常有用。HSL(色相、饱和度、明度)在调整颜色方面非常直观:通过调整色调来改变色系,调整亮度以适应色调和色调。
technical是的。免费,无需账号,图片大小和调色板数量无限制。无需安装任何东西——整个工具就是一个网页。
pricingUse Cases
品牌识别审计
从现有标志或营销资产中提取精确的HEX值,以融入你的风格指南中。匹配竞争对手品牌的颜色,用于定位牌或球场。
网页设计调色板构建
从照片或情绪板中提取主色调,导出为CSS变量,然后放入样式表。5-8色甜点涵盖了主色、点缀色和中性色,形成完整的设计系统种子。
电子商务产品列表
将产品照片背景颜色与你的店铺主题相匹配。从运动鞋或连衣裙照片中选取主色调,作为商品的亮点。
室内设计与时尚灵感
拍摄你喜欢的房间或服装,提取色彩。用它来选择与现有方案相得益彰的颜料、面料或配饰——将视觉灵感转化为可操作的样片。
数据可视化方案
生成一个由你想唤起的图像衍生的10-16种颜色的分类调色板(例如,水彩画作为柔和的图表,夕阳作为暖到冷的渐变)。比选普通色调要好。
游戏与UI资产工作流程
从精灵艺术或UI模型中提取索引色彩调色板,导入像素艺术工具或游戏引擎。调色板的JSON导出功能可与Aseprite、Photoshop及大多数资源管线集成。
Pixoate