（阿里巴巴图标库）阿里巴巴iconfont正确的使用方式是怎样的？

对设计师来说这是一个免费矢量图库网站，90%的网页设计师都在这个网站寻找相关的免费图标，而且非常好用，有了这个图库设计师可以很高效地设计出高端大气的网页，不少新入行的设计师对于寻找合适的网页图标素材抠破脑袋，现在有这款矢量图标库，显得高效有便捷。作为设计师的我认为这个网站正确的使用方式主要有以下几点。

一、用某博号注册。

当新手第一次登陆时，网站会提示你注册，你只需要按照网站的要求注册就可以了，这里对于国内设计师来说用某博号注册是非常便捷的事情，具体注册方式根据网站提示操作就行，非常简单。

二、图标收藏暂存。

当我们注册好该网站账号之后，我们可以根据自己的需求，寻找合适的图标素材，可以在图标搜索栏输入行业关键词，或你需要寻找的图标属性关键词，这样可以很快搜索到你需要的图标，最主要这个平台的图标都是免费使用，无需付费，是一款不错矢量图标网站。这个矢量图标网站，目前上架图标数量超过500万，其中包括一般的图形矢量图标，另外最近的插画矢量图标元素也越来越丰富。

三、喜欢什么图标自己下载

当我们寻找到合适的图标之后，我们可以暂存在图标收藏中，也可以直接下载，下载下来的文件都是PNG格式，运用于PS文件中非常方便。而且这个网站最大的特色是当你选择下载之前可以随便更改图标的颜色，这对设计师来说非常省事。

综上所述，对于设计师来说，用这个网站的图标来设计网页页面，是非常不错的选择，最重要的是可以白嫖，对于iconfont正确的使用方式，你还有需要补充的吗？欢迎评论交流。

使用方法为：

1、打开解压的文件夹中的demo.html；

2、看到下载的图标，按照demo的步骤，配置ionic的项目；

3、静态文件存放目录，新建font文件夹用来存放字体文件（可自定义存放）；

4、css使用font-face声明字体；

5、css定义使用iconfont的样式；

6、挑选相应图标并获取字体编码，应用于页面就可以显示图标了。

可以的。

阿里巴巴矢量图标库是免费使用的，免费图库中的图标并未注册为商标，中间不涉及到版权问题，可以商用。但是如果是有设计师标明的，就不可以用于商用，具体要看所要使用图标是否有标注可以商用。

Iconfont这个平台 ，提供了许多免费的工具，设计师不仅可以浏览下载大量优秀设计师的图标作品，还可以管理和展示自己设计的图标。是很多UI设计师日常工作的必备工具。

扩展资料：

iconfont+的看点

1、iconfont+全面升级了iconfont的帮助体系，详细介绍了iconfont平台的功能，详细介绍了绘制一套iconfont图标需要注意的事项，同时提供了iconfont在pc、iso端、安卓端应用的详细代码应用教程。

2、多色矢量图标上传和下载是这次iconfont+在功能上做的最大的升级，通过SVG支持多色的特性，正式支持多色矢量图标的下载，设计师可以有更多维度的设计发挥。

3、视觉界面升级是这次最直观的视觉体验升级，这次围绕星空主题，视觉语言上更年轻，更统一。为设计师、前端工程师用户提供一个更活泼、更具探索氛围的网站。

参考资料来源：Iconfont-Iconfont 常见问题集合

阿里巴巴矢量图标库是免费使用的，免费图库中的图标并未注册为商标，中间不涉及到版权问题，可以商用。但是如果是有设计师标明的，就不可以用于商用，具体要看所要使用图标是否有标注可以商用。

Iconfont这个平台 ，提供了许多免费的工具，设计师不仅可以浏览下载大量优秀设计师的图标作品，还可以管理和展示自己设计的图标。是很多UI设计师日常工作的必备工具。

扩展资料：

Iconfont提供的免费矢量图标，即icon，是一种图标格式，用于系统图标、软件图标等，这种图标扩展名为*.icon、*.ico。常见的软件或windows桌面上的那些图标一般都是ICON格式的。

icon元素包括两个可选的子元素：small-icon子元素和large-icon子元素。文件名是Web应用归档文件(WAR)的根的相对路径。部署描述符并没有使用icon元素。

但是，如果使用XML工具编辑部署描述符，XML编辑器可以使用icon元素。图标是特殊类型的小位图，最大尺寸为32×32像素。

所以Iconfont有个很明显的特点就是，支持尺寸和颜色的变幻，让设计师和切图说再见。当你在Iconfont平台上传了一个符合其规范的矢量图标，那你的团队接下来要做的仅仅就是下载。

Iconfont支持选择尺寸和颜色，所以，设计师不必再切2-3套图，工程师需要什么尺寸，可以在平台上自行下载。

参考资料：

Iconfont官网：功能介绍

Iconfont官网： 常见问题集合

百度百科：ICON （图标）

对于正确使用阿里巴巴iconfont想必大家都有一定的了解，但是详细的使用方式我想大家都是大同小异的吧，那么我就把它告诉大家，以便大家方便使用。

具体使用方法如下：

1.首先在I阿里巴巴iconfont矢量图标库这个页面上把你需要的相应图标随后就会点击购物车按钮加入暂存架；

2.其次就是选择完你所需要所有要用的图标后，这时你就需要给它命名。然后你还要在图标管理所对应的图标应用项目中，最后找到这个项目，获取在线链接，把里面的代码复制到CSS中；

3.完成步骤后在HTML中需要使用到图标时，使用iconfont类名。

4.最后就是你可以通过控制iconfont类的属性改变图标的样式。

这样你就完成了你所需的相关需求，通过操作，你可以轻松完成。那为什么我们要使用阿里巴巴iconfont，其实也不难发现，顾名思义iconfont也就是把图标用字体的方式呈现,其优点在于以下几个方面:首先可以通过css的样式改变其颜色，其实不是专业人士是很难搞定的，其次就是相对于图片来说,具有更高的分辨率，最后就是它拥有更小的存储，对于我们来说非常方便，所以这就是它的优点所在。任何东西的使用都有它的两面性，它的缺点就是浏览器兼容性不够普及,所幸目前大部分主流浏览器都支持。

但是只要你学会了使用的方法就会很快上手，所以说现在的科技也是有它的好处，使用它的方法其实就是你根据方法进行操作，那么你就会很快，学习这些并不是一成不变的，所以祝你早日学会。

1，首先点击右上角头像进行账号登录，一般用Github登录iconfont。

2，登录iconfont后，在界面可以选择右上角的搜索，搜索自己要的图标，比如购物车。

3，选择购物车，并把选好的图标加入到“添加至项目”，进行下一步。

4，添加至项目后，加入项目“APPicon”。

5，加入项目“APPicon”后，点击“下载至本地”保存到电脑中，默认“download.zip”文件，放到系统目录的字体目录中。

6，打开Word，选择 “插入” “符号”“其它符号”，并把选中要使用的图标，复制到Axure中进行粘贴。

7，最后把选中要使用的图标，复制到Axure中进行 “粘贴”图标后，就能正常显示在需要的地方了。

安装辅助插件后可以实现快速复制粘贴。

首先打开chrome浏览器，进入谷歌浏览器插件安装，把mxclass_com_Tampermonkey_chrome插件.crx文件拖拽到浏览器，自动安装插件。安装插件后，把copy_alibaba.js中的脚本文件全部复制到Tampermonkey中。

复制图标的具体操作方法：

1、打开任意阿里巴巴矢量库页面。

2、点击你想要复制粘贴的图标。

3、插件会自动获取你点击的图标的复制到剪贴板。

4、复制后可以直接粘贴在项目中使用，实现了点击即用。

5、打开插件，刷新页面后，鼠标滑过不会出现遮罩，直接点击相应的图标即可实现复制到剪贴板。

图标网站：

1、Iconfont-阿里巴巴矢量图标库

阿里巴巴旗下的免费矢量图库，提供了矢量图标下载、在线存储、格式转换等，可以中文搜索，直接在搜索框里输入需要的内容，就可以出现对应的素材。点击下载图标就可以了，网站还支持在线修改颜色，真的是很绝一网站。

2、Noun Project

一个基于平面设计师而创办的icon图标分享平台，提供高质量、可辨识性强的图标，使用者在网站上可以通过右上角的图标找到分类，筛选出你想寻找或使用的标志图示，分类包括动物、食物与饮料、生活保健、人物、安全与警示、科学、运动与娱乐、交通运输、旅游、天气与自然等等分类。

3、Iconninja

Icon Ninja是一个高质量的免费图标素材搜索下载平台，支持近100万个免费图标，按照文件格式、图片宽度、高度、文件大小等信息，用户可以根据自己的需求进行选择，特别适合前端工程师或者PPT设计师使用。

4、icons8

icons8是高质量的免费图标资源网站，支持在线改色、添加文字或背景装饰等。用户在下载素材时，可以选择SVG、EPS、PNG和PDF四种下载格式，方便用户后续在不同场景中的使用需求。

5、IconPark

IconPark是字节出品的一个开源图标库，可以将一个单一的SVG源文件变幻出多种主题，网站分类详细、为用户提供更轻量的代码和更灵活的使用场景；致力于构建高质量、统一化、可定义的图标资源，让大多数人都能够选择适合自己的风格图标。

阿里巴巴矢量图标库点过赞的可以在官网上找。在浏览器搜索阿里巴巴矢量图标库，进入官网后需要先登录，在首页输入关键字搜索点赞即可。

注册方法不对。阿里巴巴矢量图标库能够提供矢量图标下载、在线存储、格式转换等功能，需要使用手机短信验证注册，注册方法不对是不能注册的。

今天的内容先分享到这里了，读完本文《（阿里巴巴图标库）阿里巴巴iconfont正确的使用方式是怎样的？》之后，是否是您想找的答案呢？想要了解更多，敬请关注www.qixingcap.cn,您的关注是给小编最大的鼓励。

上一篇：关于图片格式的一些信息

下一篇：（googleio2017）谷歌2016