问题

后台管理系统有个功能，可以直接导入 psd ，通过前端对 psd 解析后，对切线进行处理，批量上传图片。节省运营一张一张上传切图的工作量，自测情况一直良好，但头一次运营自己使用，就出现了如下问题：

设计师提供的素材的颜色如上，可使用 @webtoon/psd 还原出来的颜色确是下方的颜色，偏暗一些。

原因分析

最开始以为是 @webtoon/psd 没有解析 hsb (色度、饱和度、亮度)的原因导致有色差。所以在 Github 上提了一个 issue

后来持续研究，发现 hsb 其实是随色值改变的，所以问题并不在没有解析 hsb。

通过在线PS工具，复制了一个一模一样的图层，发现色值一致，呈现仍然存在不同。

通过对比文件信息发现，原文件拥有颜色描述文件，彩色 LCD

根据这个信息，到设计师方沟通，发现 PS 创建时是可以选择色彩模式的，可能是误选了该模式（通常都使用 srgb 即可），而不同的色彩模式会改变颜色的 LAB 值，但是 rgb 和 hsb 都会保持一致。

到此，问题告一段落，因为可以让设计师在创建 PS 画布时指定色彩模式为 srgb，就不会有这个问题了。

但故事并没有结束

临时解决方案

为什么稿定设计的在线 PS 可以还原 彩色 LCD ，但我们使用的 @webtoon/psd 却做不到呢？

带着疑问又一次打开了稿定设计的网站，这次在控制台中发现了之前没有注意到的信息。

ICC Profile ，之前以为是随意的日志，没有注意，但是这个东西确是色彩描述文件，非常的重要。

之后在 @webtoon/psd 中搜索了一下这个相关的信息，发现了一个 issue 和 一个 PR , 有兴趣可👇

讨论内容是，@webtoon/psd 未能实现对色彩描述文件的解析和还原，征求作者意见后，将 icc profile 暴露出来，可在项目中自行处理。（PS：作者不擅长这个方面，也不想在项目中引入额外的库，所以将 icc profile 暴露出来）

但困难的是自行处理十分的麻烦，也没有提供代码案例。

幸运的是，贡献者在提 PR 的时候，同时提供了一个 demo 的地址

使用这个网站可以清晰的发现，还原了 icc profile 的一方明显比未还原的亮，当时简直直呼牛逼！

但是网站是压缩后的代码，无法直接参考核心实现，经过一天的努力，大概明白了压缩代码的基本原理，导出了核心方法原名wu，改为 parsePSDData，并将其导出

核心原理大概看了下，借助 lcms.wasm 对当前色彩文件向 srgb 进行还原，比如上方的颜色色值为 204，32，32

读取文件后就能还原成 218，xx，xx 色彩就变亮了！

但是这段代码无法维护，只适合临时解决问题，还是希望作者能提供一下更好的帮助，等待中！

总结

提升前：

提升后：

提高了对 PSD 的还原度还是相当高兴的，暂时先不集成进后端管理系统 ，可通过设计师指定色彩模式解决，看看后续社区的回应，有机会可以在 b 端支持更多的色彩模式。