照片里的产品是蓝色,取到的HEX却和品牌手册不同,可能并不是工具错误。光线、相机白平衡、压缩和屏幕处理都会改变图像颜色。取色读的是图片像素,不是直接测量实物材质。

先选来源,再决定取样范围
把图片拖入或粘贴到XunL 图片取色器,移动查看放大镜,在目标位置点击。Logo和纯色截图可先用一像素,照片、布料或带噪点区域可比较三乘三、五乘五平均。
例如准备一块纯色 #FF6600 图形,可核对复制出的RGB是否对应二百五十五、一百零二、零。这只是格式练习;真实照片的一个高光点不应直接代表整件产品颜色。
主色调最多,不代表品牌最重要
工具可提取若干主色并按面积占比组织。商品白底图里白色占大部分很正常,品牌标识虽然视觉重要,面积却可能很小。不能因为它没排在首位,就宣称品牌色被识别错。
透明像素不参与主色统计,输入裁切与背景也会改变比例。若目标是分析产品本身,可以先准备合适范围,但应保留原图并说明选择;不要裁掉不喜欢的颜色后仍称为整图色彩分析。
HEX、RGB和HSL是表达,不是额外测量
取Logo时尽量点纯色内部,不在抗锯齿边缘取样。边缘像素可能已经与背景混合,半透明图叠到另一底色后也会呈现不同外观。若需要恢复原始品牌色,最好取得矢量或官方规范,而不是从很小的压缩截图反推。对比两张照片时还应统一光照与白平衡,不能把拍摄差异当作材料批次变色。
同一屏幕颜色可以用不同格式写出,按设计或开发需要复制。HSL有利于理解色相和亮度关系,HEX适合常见网页样式,换一种写法并不会提高对实物颜色的准确度。
照片和截图已经经历各自处理,JPEG边缘可能混入附近颜色,屏幕色彩管理也会带来差异。正式品牌色应回查规范,不能把某张社交图片里的像素当成新的标准。
给开发与印厂的交付不同
可选择主色调或取色历史导出CSS变量、JSON,并说明哪些用于网页参考。开发还应在真实背景检查文字对比和组件状态,取到漂亮颜色不代表它适合正文、按钮和深色主题。
印刷涉及CMYK或专色与纸张工艺,不能仅靠屏幕HEX承诺成品一致。应与印厂使用正式规范并打样,尤其高饱和颜色,屏幕和油墨可呈现范围不同。
保存原图、取样位置和设置,后续需要比较才有依据。图片在浏览器处理,但素材使用权与公开范围仍需确认;取色结果也不提供商标或设计授权。
为什么移动一个像素颜色就变了?
边缘、纹理和压缩会产生相邻差异。先确认是否处于纯色区域,照片可采用小范围平均,不盯着一个偶然像素下结论。
主色占比可以当作视觉关注度吗?
不能。面积与人的视觉注意不同,小块高对比标识也可能很醒目。主色统计描述像素分布,不替代设计判断或眼动研究。
个人微信:ssevening

