如何改变网站主题颜色时，让图片中指定部分的颜色跟着变化？

2022 年 12 月 11 日
 sevenQu

在改变网站主题颜色，例如改成由黑白主题改成蓝色主题

我想让网站中的图片跟着一起改变，例如将人物图片的衣服全部改成蓝色主题

直接切换图片不太能满足要求，因为我希望让用户输入他想要的主题颜色

我的源素材是图片

求大佬指点

3296 次点击
所在节点    JavaScript
14 条回复
xell
2022 年 12 月 11 日
那就（几乎）万能的 canvas 啰 https://developer.mozilla.org/zh-CN/docs/Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas
debuggerx
2022 年 12 月 11 日
感觉用 background-color 和 mix-blend-mode 就可以
bgm004
2022 年 12 月 11 日
要不手机壳也一起变颜色吧。
Moeyua
2022 年 12 月 11 日
有个奇怪的点子，可以考虑把衣服扣掉，搞成透明图层，然后改变 background color 就行了🤣
dcsuibian
2022 年 12 月 11 日
svg 做的卡通小人还有可能
真人图片就算能做，违和感估计也会非常严重
Bapper
2022 年 12 月 11 日
可以不直接在调色盘上选，就让用户红黄蓝绿紫选一个，图片准备五套
kensoz
2022 年 12 月 11 日
位图可以试试 css 滤镜，就是效果可能不太好
chenjau
2022 年 12 月 11 日
考虑到衣服这种复杂且没有固定模式的图片, 这个需求做不了的, 至少没法做的完美, 且普适.
56rhcrivs55TVKdX
2022 年 12 月 11 日
@Moeyua 我也想到这个
biubiu001
2022 年 12 月 12 日
如果你的主题是通过 css 变量控制的话，做个 SVG ，然后也通过 CSS 变量控制，这有个参考一下： https://dianjie.github.io/tdesign-console/#/result/404
libook
2022 年 12 月 12 日
如果图片整个改，可以用 filter 变变颜色，但如果只变图片里的一部分的话，可能需要 AI 抠图。
heishu
2022 年 12 月 12 日
svg 可以搞，图片只改衣服颜色的话搞不出来
krixaar
2022 年 12 月 12 日
都是矢量图还能搞，如果是现成照片的话，得上 AI 。
sevenQu
2022 年 12 月 17 日
感谢各位大佬的回复

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.ih06.com/t/901677

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX