概述
我正在寻找关于在comps上标准化颜色配置文件的建议/解决方案,因此HTML / CSS渐变/混合匹配效果在comp中实现。我经常使用 sRGB颜色配置文件获取PSD,所以当我选择颜色来重新创建渐变/图标/或背景时,HEX颜色和生成的CSS / HTML渐变与原始的sRGB渐变不匹配。可比。通常我只是丢弃嵌入的颜色配置文件以获得监视器RGB 颜色配置文件,以便更好地匹配PSD颜色和最终结果CSS颜色。这是显示颜色配置文件之间差异的example。
详情
所以这就是困境:设计师希望将PSD标准化以使用嵌入式sRGB颜色配置文件,因为导出的图像(JPEG / PNG)保留了sRGB颜色配置文件,以便在浏览器中加载时正确显示。因此,我无法在CSS中重新创建的照片/纹理/事物将导出为具有更好的sRGB配置文件的JPEG / PNG(这是一个可以理解的请求)。
作为一名前端开发人员,我经常使用CSS和HTML(无图像)重新创建在comp中显示的元素,这要求我在PSD中的内容和呈现的内容之间正确匹配HEX颜色网站。因此,我更倾向于使用监视器RGB颜色配置文件进行标准化,以便每个人都使用更接近浏览器中实际呈现的内容。
只是好奇其他人如何解决这个问题?通常情况下我会使用CSS和PNG的混合来实现效果(特别是需要动态更改的效果(大小/色调/阴影...),因此使用sRGB导出图像并使用CSS渐变/阴影覆盖图像会结束是sRGB / Monitor RBG的混合物,因此与comp略有不同。
答案格式
希望我已经正确地提出了这个问题 - 合适的答案只是给出了如何处理问题的观点 - 或者(更好)如果有一个SCSS sRGB()函数或其他算法来转换RGB / HEX颜色到sRGB然后我会把它扔进SASS mixin。
答案 0 :(得分:1)
以下是我们如何确保Photoshop中的色彩一致性:正确的色彩选择和保存的网络图像的一致性。
我们所要做的第一件事就是确保我们在正确的颜色配置文件下工作。为此,请按照以下步骤操作:
Edit > Color Settings
或Shift + Command + K
或Shift + Control + K
。Settings
下拉菜单中选择North America Web/Internet
OK
。View > Proof Setup
并选择Internet Standard RGB (sRGB)
Command + Y
或Control + Y
以启用Proof Colors
,您也可以转到View > Proof Colors
Convert to sRGB
。您已经完成了,您现在应该享受所有文件的色彩准确性,并且HTML和图像将确保在设备和浏览器中一致显示。