PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

需求


        从网上下载图片很难下载到整套,包括一个按键的三种状态或者是多个图标非同色系,笔者没有整体配色,只讲述PS比较简单的制作方法,目前满足日常使用。

原理


        使用PS进行修改制作

实现步骤


步骤一:打开图标文件

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

步骤二:增加背景图层

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

步骤三:修改背景图层的颜色和透明度(hover状态的)

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

步骤五:剪裁保存(可设置剪裁大小),最好是另外存储文件“文件”中的“存储为”,注意存储格式,hover状态的到此结束。

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

步骤六:修改图标图标实体的颜色

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

步骤七:删掉“背景”图层,直接选中“图层0”新建背景图层,对背景使用填充进行上色,保存参照 步骤五

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法

所制作的示例:

PS实用技巧:用原始图片制作显示(正常状态)、鼠标悬浮(hover)、鼠标点击(pressed)的方法