当前位置:首页 > 大街拾贝 > 正文内容

像素图标设计需要注意的问题

liuxy1年前 (2024-01-19)大街拾贝942

像素 图标 设计 需要注意的问题有很多,下面我们先来设计一个像素图标。    

首先我们用 Photoshop 新建一个 14x14 像素大小的 透明 文件。

下面我们来画图标的轮廓,笔刷选择 1px 的铅笔,使用暗灰色调。

注意:1. 绘制直线可以在起始点点击一下,再按住 Shift 点击直线的终点即可。

            2. 在任何时候,如果你想清除的像素,请使用橡皮擦工具,选择铅笔模式和 1px 大小。

画好了轮廓,下面我们用 魔术 棒工具对中间的部分添加渐变,具体步骤:新建图层 - 使用魔术棒工具 - 点击中间空白部分 - 在选区内使用渐变工具添加渐变(前景色为浅灰色,背景色为白色)。

下面我们对图标进行高亮设计,具体步骤:新建图层 - 在轮廓内部左侧绘制白色高亮部分。

接下来我们将所有图层组合到文件夹中(快捷键“Ctrl+G”),然后我们再来绘制一个铅笔图标。

同样,我们先画一个铅笔的轮廓,然后再来绘制渐变并组合在文件夹内。

这样一个像素图标就画好了,这里我要补充一点,画多大尺寸的图标就要新建多大尺寸的文件,千万不可在大尺寸的文件内设计图标后缩小为小图标。

打赏 支付宝打赏 微信打赏

扫描二维码推送至手机访问。

版权声明:本文由十六大街发布,如需转载请注明出处。

本文链接:http://16dajie.com/shibei/61.html

“像素图标设计需要注意的问题” 的相关文章

一款好看的打字效果跳转单页

一款好看的打字效果跳转单页

<!doctype html> <html> <head><meta http-equiv="refresh" content="17; URL=http://16dajie.com/&q...

超酷的 HTML5+CSS3 loading 效果

超酷的 HTML5+CSS3 loading 效果

用 gif 图片来做 loading 的时代已经过去了,它显得太 low 了,而用 HTML5/CSS3 以及 SVG 和 canvas 来做加载动画显得既炫酷又逼格十足。这已经成为一种趋势。这里收集了几十个用 html5 和 css3 实现的 loading 效果,以供学习参考。01. CSS R...

网站挂灯笼代码,网站灯笼Css代码

网站挂灯笼代码,网站灯笼Css代码

   最近又要到一年一度的春节了,很多网站也开始挂上了灯笼,我也趁着这个机会水一篇文章,据我所知这段代码好久了,具体出处也无从考证,不过我看网上都是一边灯笼,我觉得不大好看就改了的两边灯笼的版本出来,代码会放在下面,按照自己的需要拿吧。版本一:单边居右HTML代码:将下面的HTM...

快速设计高逼格的LOGO

快速设计高逼格的LOGO

在我们制作LOGO的时候,经常会看到很多大神的设计稿有很多高精度的辅助线,让整个LOGO显得非常精细(如下图中的LOGO)。而且很多同学在制作LOGO形状的时候经常因为路径线条的画的不流畅,而显得LOGO粗糙廉价。那么今天MICU教大家如何快速绘制高品质的LOGO,利用5分钟高效完成设计稿。新建导入...

阿里云服务器新手入门:从购买、配置到搭建网站全教程

阿里云服务器新手入门:从购买、配置到搭建网站全教程

阿里云服务器使用教程阿里云服务器分为云服务器ECS和轻量应用服务器,本文以云服务器ECS为例,来详细说下云服务器配置选择、省钱购买方法、搭建网站LNMP环境及网站上线全流程,阿里云服务器使用非常简单,跟着教程一步步配置,十分钟网站上线全流程:一:购买一台阿里云服务器ECS如果已经购买完云服务器,可以...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。