AI字体设计 Illustrator怎么制作矩形字体_百度知道
AI字体设计 Illustrator怎么制作矩形字体
提问者采纳
然后设置下填充颜色和描边，其他的可以采用默认设置，也可按下快捷键Ctrl+N2，这个是方便我们下面用矩形制作矩形字体61，然后按下Ctrl+R拉出参考线，然后点击确定按钮3、在弹出的新建文档里输入你要保存的名称，点击左边的文字工具5，把描边设置为空4、打开Adobe Illustrator CS5软件、设置好填充颜色和描边后。点击软件导航上的文件，然后选择下拉菜单里的新建。把填充的颜色设置为黑色、在画布上打出要做的矩形字
其他类似问题
为您推荐：
字体设计的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁AI教程字体设计上形状生成器平面设计文字工具illustrator - 在线观看 - 热点 - 乐视视频
AI教程字体设计上形状生成器平面设计文字工具illustrator
收藏成功！同时能自动追剧。
下载到电脑
缓存至手机
我们对您的信息保密并不收取任何费用
转存到云盘
方式B免费发短信到手机
我们对您的信息保密并不收取任何费用
方式C下载APP到本机
英雄，快来抢沙发！
英雄，快来抢沙发！
乐视集团旗下网站
乐视网频道
乐视网旗下产品
Copyright &
乐视视频（le.com）All rights reserved.AI把图标制作成字体方法介绍
作者：佚名
字体：[ ] 来源：互联网 时间：01-07 12:01:20
这篇教程是向脚本之家的朋友介绍AI把图标制作成字体方法，教程很不错，推荐到脚本之家，喜欢的朋友可以跟着教程一起来学习吧
随着手机屏幕分辨率的提升，对移动端网页图片精度的要求也逐渐提升。以往采用图片形式的图标，尺寸的足够大才能保证高PPI下显示效果足够清晰。同时，不知何时，字体图标渐渐兴起。所谓字体图标就是把图标做成字体，在网页中可以和文字一样，用CSS赋给字号、颜色、阴影等，想放多大就多大。优势不言而喻。
　　近些年，公司转型，开始做基于Html5的移动端Web开发。之前一直使用网上免费提供的字体图标库，但免不了碰到个性化的需求，因此前段时间，抽空研究了一下如何自行制作字体图标。网上教程很多，不过大多挺复杂的，需要安装一些软件工具。本人折腾了半天，总算摸索出了一套简单的方法，现在在这里分享给大家：
　　基本思路：一、制作图标 & 二、生成图标字体 & 三、用CSS把字体引入网站。
　　工具：
　　1、Adobe Illustrator，版本不限，需要能将文件存为SVG格式即可(其他能制作SVG格式的软件应该也可以，我没试过);
　　2、压缩工具，支持ZIP格式(基本上是个压缩工具都支持)。
　　另外确保电脑能上网。
具体的制作步骤如下：
　　1、在AI中新建文档，宽高均为512像素，如下图(不要问我为啥是512px，我也不知道，我试了几次后算出来的，只有这个尺寸和网页里的字号是对的上的);
　　2、在文档中画图标，用钢笔还是图形工具随意，但要注意颜色为黑色，背景为空，也不能有渐变，半透明啥的。如下图(原则上图形的描点要尽可能少，同时尽量在一个路径里完成整个图标，四边根据设计情况选择是否留空，保证所有图标在视觉上大小的均衡，以及风格的统一);
　　3、画完后保存，保存时要选择SVG格式，这是重点，如下图。SVG选项默认的就好(我的默认的是1.1版本)，另外命名和图标要匹配，用英文，懒的话用拼音，至少保证自己认得哪个是哪个。多个单词用&-&代替空格(svg文件可以在浏览器里打开查看哦);
　　SVG文件在谷歌浏览器中查看的效果
　　4、重复以上步骤，把需要的图标都画出来保存成SVG文件，并放在同一个文件夹里，给文件夹命好名，如下图。
　　这里只做三个做示例。实际做时建议两个或两个以上。只有一个的话是不生成CSS和html文件的。
　　5、将此文件夹压缩为zip文件。
　　6、访问地址：http://iconvau.lt/app(稍有些慢，还请耐心等待。这个网站很厉害，直接把后两大步包办了)，进入后会看到如下界面，将zip文件拖入到红框范围中(也可点击红框范围，选择zip文件)，耐心等待文件上传并转换，别关浏览器。字体转换完成后会自动下载一个名为iconvault.zip的文件，没有自动下载可以点网站中出现的链接进行下载(压缩包放在附件里供大家参考)。
　　7、解压iconvault.zip文件，能看以下文件(可以开启后缀名查看文件类型)：.fontcustom-data可以删除，eot、svg、ttf、woff这四个是字体文件，分别兼容不同的平台。一个CSS文件，以及一个html文件。用浏览器打开html文件，可以看到你设计的全部图标，以不同的字号排列在里面。
　　用浏览器打开html文件能看到的内容
　　对于强迫症来说，这么长的文件名会让人抓狂的，那么打开css文件，在顶端找到几个字体文件的名称，改掉，然后再改掉相应字体文件的名称即可。
　　网站的引入，html文件是很好的示例，懂点html和CSS的看看就知道了。引入CSS样式后，只要在网页里写这样就行了，和文字一样，赋给相应的样式，就会有相应的效果。
　　到这里字体图标的制作就算完成了，生成的字体图标较小号时在电脑上浏览会有些许瑕疵，这是因为制作图标时没有考虑小分辨率的情况，就像过于小号的文字显示也会不理想一样，这需要进行精细的适配。但在高PPI的手机屏幕上浏览就没有问题了。当然，更加丰富多彩的图标，目前依旧只能依赖图片。
　　看到这里，大家可以试着动手，把公司或者自己的logo做成图标字体，试一试吧!
大家感兴趣的内容
12345678910
最近更新的内容如何利用Photoshop或illustrator让图片和文字的像素清晰可辨-马海祥博客
新型SEO思维就是从一个全新的层次上提升seo优化的水平，达到网络信息最佳化的展示效果！
> 如何利用Photoshop或illustrator让图片和文字的像素清晰可辨
如何利用Photoshop或illustrator让图片和文字的像素清晰可辨
时间：&&&文章来源：马海祥博客&&&访问次数：
大家在设计界面和网页时，是不是经常碰到PS里绘制的图标虽然是矢量的，但还是会有许多虚边，当我们把图片放大、缩小、旋转后虚边变的更严重了，或者是在AI里绘制的精美矢量图标粘到PS里就变虚了，我们辛苦设计的作品就这样变&糊了&，这是我们双眼所不允许的，我们要让每一个像素都清晰可辨。
要想解决这些问题就要先理解PS像素组成的原理，了解一些设置选项和使用技巧，下面我就借助马海祥博客的平台上跟和大家分享一下如何利用Photoshop或Illustrator让图片和文字的每一个像素都清晰可辨：
1、绘制边缘清晰的&形状图层&
我们通常在PS（Photoshop）里绘制矩形时会用&矩形工具&，这样产生的是矢量的形状图层，它的好处是我们无论放大缩小时都保持矢量属性，但当我们放大视图看时还是有虚边（如下图所示），这些虚边虽然在绘制大的图形时影响不太大，但当我们绘制很小的像素级图标时，就会很明显了。
解决方法是选中下图列出的&对齐像素&选项，当我们再绘制同样的矩形时，放大视图看边缘就清晰可辨了（如下图所示）。其中的原理是：我们屏幕显示的图像是由无数个像素组成的，也就是说像素是图形的最小单位，通常当我们绘制的图形不是整数像素时，比如宽是20.5像素，那0.5的像素小于1像素，PS就会以虚边显示。当选中&对齐像素&选项时，我们绘制的宽、高将都是整数了（有兴趣的可以查看一下马海祥博客的《》相关介绍）。
2、旋转图形时保持边缘清晰
当我们以矩形的中心点90度旋转时，得到的矩形缺失了两个边。这是什么原因呢？
得知这个矩形的长是奇数、宽是偶数。当以中心点旋转时像素不能整分，所以得到这种结果。
解决办法是：可以选矩形的四个角的任一顶点为中心点旋转，或者使矩形的长宽都为奇数或偶数值。如果我们的操作是旋转并缩放图形，最好是旋转完按确定，再进行缩放，不要连续操作完再确定，这样得到的结果会比较清晰。
3、让字体的每一个像素都清晰可见
但是在PS里，字体会有很多虚边，如下图，放大之后字体的虚边就很明显了，字体也显的不是很清晰。这样是很影响视觉效果的，有同学会说，将文字栅格化之后删除那些虚边或者得到选区，收缩1像素，可是，在实际运用中文字都是会变形的。那么我们该怎么办呢？在此，马海祥告诉大家一个方法来解决这个问题：
（1）、先将字体放大后，可以看见有虚边。
（2）、右键文字图层，点击：转换为形状。
（3）、如下样子，文字会出现路径及锚点。
（4）、可以看见放大文字层后，虚边较多，注意：用直接选择工具 ，拖动锚点，往虚边的里面拖动。
（5）、把虚边一点一点的往里拖动，要注意耐心和细节，最后对比一下，是不是很清晰了呢。
现在不管放大多少倍都不会有虚边了。
4、AI粘入PS时保持边缘清晰
有时当我们在AI（Illustrator）里绘制了图标后，粘到PS里就会出现如下图的虚边，这是有两种原因造成的：
一是在AI里新建文件时没有选中&对齐像素网格&选项（只有AI CS5以上版本有这个选项），这样绘制的图标的各个数值不为整数的情况，粘到PS里就会出现虚边。
再一个是选中了&对齐像素网格&选项粘到PS中依然出现虚边，这是要在粘之前在PS中建一个与图标大小相同的选区，再粘进来就OK了，因为PS中粘贴板中的图标粘入到视图时，图标是以被粘入视图的中心点定位粘贴的，这样粘贴的位置可能不是整数值，所以会出现虚边，这时我们要建一个同样大小的选区，再粘就没问题了。
还有粘贴时选&形状图层&，这样以后的可编辑性会比较强。
马海祥博客点评：
illustrator（简称AI）是矢量图的创作、处理软件，主要用来制作动画、艺术创作的，它生成的矢量图可以无限放大而不失真和损失。此外它可以将矢量图导出为位图，得到质量不错的位图，然后再用位图软件进行后期处理。
Photoshop（简称PS）就是位图的合成处理软件，主要用来对各种已有的素材进行后期加工处理，合成各种各样的图片。比如广告图片等等。
所以，两者最大的区别：一个是矢量图，一个是位图；一个是创作型，一个是合成处理型；一个处于前期，一个后期。
本文为原创文章，如想转载，请注明原文网址摘自于/Photoshop/649.html，注明出处；否则，禁止转载；谢谢配合！
您可能还会对以下这些文章感兴趣！
今天早上我一如既往的打开电脑查找我所需要的资料，在使用360搜索时却发现个奇怪的现象，在通过360综合搜索……
今天一早打开网站就看到很多的圈内人士在网上讨论，说百度昨晚在搜索引擎搜索页面做出的一个小变化，在搜索……
百度百家的问题在于，它还基本上是从百度新闻首页倒流给作者，但随着作者越来越多，狼多肉少，显然并非长久……
目前，在中国做seo的在大多数时候，我们都是以百度和Google作为……
最近我在给公司的编辑和优化人员培训时，在讲到文章关键词的密度……
搜索引擎Spider系统的目标就是发现并抓取互联网中一切有价值的网……
当一个搜索蜘蛛访问一个站点时，它会首先检查该站点根目录下是否……
为什么客户在打开网页之后很快关闭了页面？为什么我的网站停留时……
链接也称超级链接，是指从一个网页指向一个目标的连接关系，而在……
本月热点文章用AI字体设计中这种效果是怎么做的_百度知道
用AI字体设计中这种效果是怎么做的
我有更好的答案
用黑体字先打出来 转换成路径 再变形（移动各个锚点） 之后再用钢笔工具在背面画白底黑色描边就可以啦
描边 -- 轮廓化描边 --描边--ok
其他类似问题
1人觉得有用
为您推荐：
字体设计的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁