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

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

liuxy11个月前 (01-19)大街拾贝601

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

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

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

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

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

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

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

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

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

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

打赏 支付宝打赏 微信打赏

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

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

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

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

js制作网页动态背景

js制作网页动态背景

装逼必备canvascanvas简单来说就是一块画布,通过JavaScript来进行绘制,可以用来制作各种特效那么如何利用canvas来制作一个动态的网页背景呢,就像这样子:首先,我们就需要在我们的html页面中创建一个canvas<div id="background&q...

超酷的 HTML5+CSS3 loading 效果

超酷的 HTML5+CSS3 loading 效果

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

Typecho 不使用插件实现回复可见

进入 网站目录/usr/themes/主题 找到 post.php 打开步骤一在 post.php 找到 <?php $this->content(); ?> 替换成php 代码:<?php$db...

EMUELEC游戏添加删除工具

EMUELEC游戏添加删除工具

EMUELEC 游戏添加删除工具使用说明1.软件整体情况主要包含EMUELEC系统SSH连接,游戏列表的获取,游戏图片以及视频预览,游戏上传以及下载,目前仅支持网络传输,需要电脑和盒子在同一个局域网内使用,主题功能未开发功能使用步骤第一步:进入emuelec系统查看游戏系统IP地址,并且确保系统已开...

安装CorelDRAW 2017 过程中报错error 1312

安装CorelDRAW 2017 过程中报错error 1312

错误如图:我的解决办法是:打开C盘,再打开隐藏文件,找到下图报错中路径里面的:messagse文件删掉,再点重试就可以安装了。...

下一代艺术二维码和艺术字

下一代艺术二维码和艺术字

.button {display: inline-block;border-radius: 4px;background-color: #f4511e;border: none;color: #FFFFFF;text-align: center;font-size: 28px;padding: 20...

发表评论

访客

看不清,换一张

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