最简单的改变图标颜色的方法(工具Photoshop)

直接上干货:

一、老鸟专享极简大气一目了然版 (*´╰╯`๓)♬

图层 → 图层样式 → 颜色叠加

(敲黑板,划重点,so easy 


二、菜鸟尊享感人至深详细到哭版 (。◕ˇ∀ˇ◕)

素材:PNG格式镂空图标,  素材来源:某图标素材网站,  工具:Photoshop CC

原图如下:

待修改的镂空图原图

步骤:

1、打开原图

原图

2、用矩形选框工具选中整张图片(或者Ctrl+A)

全选

3、图层 → 图层样式 →颜色叠加

颜色叠加

4、点击箭头所指区域


5、设置叠加颜色

6、设置叠加颜色完毕,然后点击确定→确定

7、图标修改颜色完成

效果

8、文件 → 存储为Web所用格式

存储


注意如果是半透明的镂空图标右上角选择PNG-24,不要选择PNG-8。

存储

完成后的效果:

修改颜色之后的镂空图

注:

1.如果存储为PNG-8的,在网页上的效果可能会像下图这样惨烈:

PNG-8之网页惨状

PNG-8只有1位布尔透明通道,只支持像素级的纯透明,不支持alpha透明,说人话就是:只能完全透明或者完全不透明,不支持半透明。(上图中出现的白边就是图片保存为PNG-8后,原先半透明的边缘变成的不透明的部分)

PNG-24有8位布尔透明通道,支持半透明。

选择PNG-24格式不会出现上图问题。


2.图像模式要选“RGB颜色”。如果模式是“灰度”则无法进行颜色叠加。

RGB颜色

致本汪没有设计师也没有程序员的单打独斗的时光。

为有猫而奋斗~(•̀ᴗ•́)و ̑̑

推荐阅读更多精彩内容