现在的位置: 首页 > 网络采风 > 正文

Fontello:图标字体在线生成器,提供免费图标字库下载

2014年08月26日 网络采风 ⁄ 共 704字 ⁄ 字号 暂无评论 ⁄ 阅读 503 次

Fontello集成了许多免费的图标字库,有上千个免费图标可供使用。你可以导入自己的svg字体或svg图标,也可以从它的图标字库中选择需要的图标,并通过Fontello的图标字体生成器在线生成自己的图标字体,并下载应用之。此外,Fontello还提供了API接口供用户开发使用。Fontello是开源项目,可以从GitHub上打包下载。

免费的图标字体在线生成网站还有:

IcoMoon:提供免费矢量图标字体下载及在线生成服务

Fontastic:在线创建自己的图标字体,免费享用图标字体云服务

简单说下Fontello图标字体生成器的使用:

1、打开 http://fontello.com

2、在免费字体图标选择(可多选)或导入自己的图标(svg字体或svg图像)。

Fontello图标字体在线生成器

3、可以使用默认的也可以自定义图标的CSS名称。

Fontastic自定义图标名称

4、如果需要,还可以自定义图标的字形码。

Fontastic自定义图标的字形码

5、点击设置按钮对字体进行高级设置,填写字体名称后下载字体压缩包。

Fontastic图形字体高级设置

6、解压后将“font”文件夹和“CSS”复制到网站目录中,或将“CSS”文件夹中的样式代码粘贴到网站的CSS文件中。参考 demo.html,可以看到相对应的CSS类名(class name),对照使用即可。

Fontastic字体压缩包中的文件

如果想要下载Fontello集成的免费字体库,可以在字库名称所在行中看到小房子的图标,点击即可进入该字库网站下载字体包。如下图所示:

Fontastic下载免费图标字体包

Fontello源码下载:https://github.com/fontello/fontello/archive/master.zip

补充说明:

1、本文中的图片均为使用谷歌浏览器翻译后的屏幕截图。

2、使用图标字体的好处可以参考此文:使用图标字体的优点与缺点。

给我留言

留言无头像?


×