tokenpocket下载官方app下载|阿里云图标库官网

作者： tokenpocket下载官方app下载

2024-03-10 00:11:47

iconfont-阿里巴巴矢量图标库

产品图标

{"moduleinfo":{"name":"just a test"},"$tmsId":"tce/2219238"}

{"moduleinfo":{"javascripts_count":[{"count_phone":0,"count":0}],"styles_count":[{"count_phone":0,"count":0}],"htmls_count":[{"count_phone":2,"count":2}]},"htmls":[{"text":""},{"text":"

Download All

Download All PSD

Download All PNG

Download All SVG

Download All AI

弹性计算

数据库

存储与CDN

网络

大规模计算

云盾

管理与监控

应用服务

互联网中间件

域名与网站

开发者资源

移动服务

其他产品

行业云

视频服务

PSD

PNG

SVG

云服务器 ECS

PSD

PNG

SVG

云引擎 ACE

PSD

PNG

SVG

弹性伸缩服务 ESS

PSD

PNG

SVG

资源编排ROS

PSD

PNG

SVG

高性能计算HPC

PSD

PNG

SVG

云数据库

PSD

PNG

SVG

表格存储

PSD

PNG

SVG

云数据库Memcached版

PSD

PNG

SVG

云数据库Redis版

PSD

PNG

SVG

分析型数据库ADS

PSD

PNG

SVG

数据传输服务 DTS

PSD

PNG

SVG

数据管理DMS

PSD

PNG

SVG

云数据库MongoDB版

PSD

PNG

SVG

Oceanbase

PSD

PNG

SVG

PB 级云数据库 PetaData

PSD

PNG

SVG

开放存储服务 OSS

PSD

PNG

SVG

开放归档服务 OAS

PSD

PNG

SVG

消息对列服务 MNS

PSD

PNG

SVG

内容分发网络 CDN

PSD

PNG

SVG

块存储DISK

PSD

PNG

SVG

文件存储NAS

PSD

PNG

SVG

负载均衡slb

PSD

PNG

SVG

专有网络vpc

PSD

PNG

SVG

高可用虚拟ip

PSD

PNG

SVG

高速通道

PSD

PNG

SVG

容器服务

PSD

PNG

SVG

大数据计算服务

PSD

PNG

SVG

批量计算服务 BCS

PSD

PNG

SVG

采云间 DPC

PSD

PNG

SVG

数据集成 CDP

PSD

PNG

SVG

云盾

PSD

PNG

SVG

DDOS高防IP

PSD

PNG

SVG

渗透测试服务 APS

PSD

PNG

SVG

DDoS专家服务 ATS

PSD

PNG

SVG

安骑士AEGIS

PSD

PNG

SVG

安全网络

PSD

PNG

SVG

态势感知 SAS

PSD

PNG

SVG

Web应用防火墙 WAF

PSD

PNG

SVG

弱点分析 SCAN

PSD

PNG

SVG

绿网

PSD

PNG

SVG

云盾先知计划

PSD

PNG

SVG

DDOS防护ddosbasic

PSD

PNG

SVG

服务器安全托管MSS

PSD

PNG

SVG

密码机HSM

PSD

PNG

SVG

内容检测API

PSD

PNG

SVG

数据安全险DSI

PSD

PNG

SVG

补丁管理vipaegis

PSD

PNG

SVG

安全日志管理slm

PSD

PNG

SVG

云监控

PSD

PNG

SVG

资源访问管理服务 RAM

PSD

PNG

SVG

钥密监控 KMS

PSD

PNG

SVG

简单日志服务 SLS

PSD

PNG

SVG

开放搜索服务 OpenSearch

PSD

PNG

SVG

性能测试服务 PTS

PSD

PNG

SVG

移动数据分析 MAS

PSD

PNG

SVG

移动加速 CAS

PSD

PNG

SVG

多媒体转码服务 MTS

PSD

PNG

SVG

API网关

PSD

PNG

SVG

企业级分布式应用服务edas

PSD

PNG

SVG

消息队列ons

PSD

PNG

SVG

分布式关系型数据库drds

PSD

PNG

SVG

物联网 iot

PSD

PNG

SVG

域名与网站

PSD

PNG

SVG

域名

PSD

PNG

SVG

云解析 DNS

PSD

云虚拟主机

PSD

PNG

SVG

云邮箱

PSD

PNG

SVG

企业建站

PSD

PNG

SVG

弹性web托管

PSD

PNG

SVG

开发者工具CLI

PSD

PNG

SVG

开发者工具 Visual Studio

PSD

PNG

SVG

开发者工具 Eclipse

PSD

PNG

SVG

阿里云 API

PSD

PNG

SVG

云推送

PSD

PNG

SVG

工具与镜像 Toolsimage

PSD

PNG

SVG

可用性中心 SAC

PSD

PNG

SVG

无线开发平台 DPA

PSD

PNG

SVG

御膳房 YSF

PSD

PNG

SVG

弹性网络IP

PSD

PNG

SVG

金融云 AFC

PSD

PNG

SVG

政务云 AGC

PSD

PNG

SVG

渲染云 ARC

PSD

PNG

SVG

移动云 AWC

PSD

PNG

SVG

多媒体云

PSD

PNG

SVG

游戏云 GAME

PSD

PNG

SVG

医疗云 HCC

PSD

PNG

SVG

物联网云 IOT

PSD

PNG

SVG

安全云 ASC

PSD

PNG

SVG

O2O

PSD

PNG

SVG

云存储 STORAGE

PSD

PNG

SVG

网站 WS

PSD

PNG

SVG

点播服务

PSD

PNG

SVG

视频云

1. 阿里云图标是包括阿里云产品图标以及阿里云解决方案图标的图标集合，阿里云拥有知识产权和解释权。

2. 客户或合作伙伴需事先获得阿里云的许可方可下载、使用这些图标。

3. 经许可后，客户或合作伙伴在使用场景里不得自行更改图标的形状、颜色、名称、比例。

4. 许可为非独家的，不得转让或转授权。

yload":{"allShortcutsEnabled":false,"fileTree":{"":{"items":[{"name":"2022-orange","path":"2022-orange","contentType":"directory"},{"name":"collections","path":"collections","contentType":"directory"},{"name":"screenshots","path":"screenshots","contentType":"directory"},{"name":"README.en.md","path":"README.en.md","contentType":"file"},{"name":"README.md","path":"README.md","contentType":"file"}],"totalCount":5}},"fileTreeProcessingTime":1.922885,"foldersToFetch":[],"repo":{"id":738841036,"defaultBranch":"main","name":"alibaba-cloud-icons","ownerLogin":"mcsrainbow","currentUserCanPush":false,"isFork":false,"isEmpty":false,"createdAt":"2024-01-04T07:02:55.000Z","ownerAvatar":"https://avatars.githubusercontent.com/u/2627797?v=4","public":true,"private":false,"isOrgOwned":false},"symbolsExpanded":false,"treeExpanded":true,"refInfo":{"name":"main","listCacheKey":"v0:1704351857.0","canEdit":false,"refType":"branch","currentOid":"5807568be1c94550b4889c505770b391e53e1c45"},"path":"README.md","currentUser":null,"blob":{"rawLines":null,"stylingDirectives":null,"csv":null,"csvError":null,"dependabotInfo":{"showConfigurationBanner":false,"configFilePath":null,"networkDependabotPath":"/mcsrainbow/alibaba-cloud-icons/network/updates","dismissConfigurationNoticePath":"/settings/dismiss-notice/dependabot_configuration_notice","configurationNoticeDismissed":null},"displayName":"README.md","displayUrl":"https://github.com/mcsrainbow/alibaba-cloud-icons/blob/main/README.md?raw=true","headerInfo":{"blobSize":"1.56 KB","deleteTooltip":"You must be signed in to make or propose changes","editTooltip":"You must be signed in to make or propose changes","ghDesktopPath":"https://desktop.github.com","isGitLfs":false,"onBranch":true,"shortPath":"7f8925c","siteNavLoginPath":"/login?return_to=https%3A%2F%2Fgithub.com%2Fmcsrainbow%2Falibaba-cloud-icons%2Fblob%2Fmain%2FREADME.md","isCSV":false,"isRichtext":true,"toc":[{"level":2,"text":"阿里云官方矢量图标和 draw.io 自定义图标库","anchor":"阿里云官方矢量图标和-drawio-自定义图标库","htmlText":"阿里云官方矢量图标和 draw.io 自定义图标库"},{"level":3,"text":"背景","anchor":"背景","htmlText":"背景"},{"level":3,"text":"draw.io 自定义图标库截图","anchor":"drawio-自定义图标库截图","htmlText":"draw.io 自定义图标库截图"},{"level":3,"text":"draw.io 自定义库下载","anchor":"drawio-自定义库下载","htmlText":"draw.io 自定义库下载"},{"level":3,"text":"阿里云矢量图来源","anchor":"阿里云矢量图来源","htmlText":"阿里云矢量图来源"},{"level":3,"text":"draw.io 中图标的顺序","anchor":"drawio-中图标的顺序","htmlText":"draw.io 中图标的顺序"}],"lineInfo":{"truncatedLoc":"47","truncatedSloc":"35"},"mode":"file"},"image":false,"isCodeownersFile":null,"isPlain":false,"isValidLegacyIssueTemplate":false,"issueTemplate":null,"discussionTemplate":null,"language":"Markdown","languageID":222,"large":false,"planSupportInfo":{"repoIsFork":null,"repoOwnedByCurrentUser":null,"requestFullPath":"/mcsrainbow/alibaba-cloud-icons/blob/main/README.md","showFreeOrgGatedFeatureMessage":null,"showPlanSupportBanner":null,"upgradeDataAttributes":null,"upgradePath":null},"publishBannersInfo":{"dismissActionNoticePath":"/settings/dismiss-notice/publish_action_from_dockerfile","releasePath":"/mcsrainbow/alibaba-cloud-icons/releases/new?marketplace=true","showPublishActionBanner":false},"rawBlobUrl":"https://github.com/mcsrainbow/alibaba-cloud-icons/raw/main/README.md","renderImageOrRaw":false,"richText":"\n 中文 | English\n\n阿里云官方矢量图标和 draw.io 自定义图标库\n背景\n在众多知名的绘图软件（如draw.io、Lucidchart、Gliffy、ProcessOn等）中都没有内置一套完整的、最新的阿里云官方矢量图标。\n因此，在画阿里云相关的网络拓扑图和架构图时，和AWS、Azure、GCP相比，很不方便。\n于是，我收集整理了一套完整的阿里云矢量图标，分别标注了中英文名称，并生成了相应的draw.io图标库，方便自己的同时也希望能够帮助到大家。\ndraw.io 自定义图标库截图\n\ndraw.io 自定义库下载\n中文版 Alibaba Cloud.xml ｜英文版 Alibaba Cloud.xml\n阿里云矢量图来源\n链接: 阿里云设计中心 | 阿里云产品类别\n矢量图标颜色代码: #ff6a00\ndraw.io 中图标的顺序\n.\n├── 00 Logo\n├── 01 网络与CDN\n├── 02 计算\n├── 03 容器\n├── 04 Serverless\n├── 05 数据库\n├── 06 存储\n├── 07 中间件\n├── 08 迁移与运维管理\n├── 09 开发工具\n├── 10 企业服务与云通信\n├── 11 安全\n├── 12 大数据计算\n├── 13 人工智能与机器学习\n├── 14 物联网\n└── 15 媒体服务\n\n","renderedFileInfo":null,"shortPath":null,"symbolsEnabled":true,"tabSize":8,"topBannersInfo":{"overridingGlobalFundingFile":false,"globalPreferredFundingPath":null,"showInvalidCitationWarning":false,"citationHelpUrl":"https://docs.github.com/github/creating-cloning-and-archiving-repositories/creating-a-repository-on-github/about-citation-files","actionsOnboardingTip":null},"truncated":false,"viewable":true,"workflowRedirectUrl":null,"symbols":{"timed_out":false,"not_analyzed":false,"symbols":[{"name":"阿里云官方矢量图标和 draw.io 自定义图标库","kind":"section_2","ident_start":94,"ident_end":151,"extent_start":91,"extent_end":1596,"fully_qualified_name":"阿里云官方矢量图标和 draw.io 自定义图标库","ident_utf16":{"start":{"line_number":4,"utf16_col":3},"end":{"line_number":4,"utf16_col":28}},"extent_utf16":{"start":{"line_number":4,"utf16_col":0},"end":{"line_number":47,"utf16_col":0}}},{"name":"背景","kind":"section_3","ident_start":157,"ident_end":163,"extent_start":153,"extent_end":636,"fully_qualified_name":"背景","ident_utf16":{"start":{"line_number":6,"utf16_col":4},"end":{"line_number":6,"utf16_col":6}},"extent_utf16":{"start":{"line_number":6,"utf16_col":0},"end":{"line_number":12,"utf16_col":0}}},{"name":"draw.io 自定义图标库截图","kind":"section_3","ident_start":640,"ident_end":672,"extent_start":636,"extent_end":725,"fully_qualified_name":"draw.io 自定义图标库截图","ident_utf16":{"start":{"line_number":12,"utf16_col":4},"end":{"line_number":12,"utf16_col":20}},"extent_utf16":{"start":{"line_number":12,"utf16_col":0},"end":{"line_number":16,"utf16_col":0}}},{"name":"draw.io 自定义库下载","kind":"section_3","ident_start":729,"ident_end":755,"extent_start":725,"extent_end":930,"fully_qualified_name":"draw.io 自定义库下载","ident_utf16":{"start":{"line_number":16,"utf16_col":4},"end":{"line_number":16,"utf16_col":18}},"extent_utf16":{"start":{"line_number":16,"utf16_col":0},"end":{"line_number":20,"utf16_col":0}}},{"name":"阿里云矢量图来源","kind":"section_3","ident_start":934,"ident_end":958,"extent_start":930,"extent_end":1142,"fully_qualified_name":"阿里云矢量图来源","ident_utf16":{"start":{"line_number":20,"utf16_col":4},"end":{"line_number":20,"utf16_col":12}},"extent_utf16":{"start":{"line_number":20,"utf16_col":0},"end":{"line_number":26,"utf16_col":0}}},{"name":"draw.io 中图标的顺序","kind":"section_3","ident_start":1146,"ident_end":1172,"extent_start":1142,"extent_end":1596,"fully_qualified_name":"draw.io 中图标的顺序","ident_utf16":{"start":{"line_number":26,"utf16_col":4},"end":{"line_number":26,"utf16_col":18}},"extent_utf16":{"start":{"line_number":26,"utf16_col":0},"end":{"line_number":47,"utf16_col":0}}}]}},"copilotInfo":null,"copilotAccessAllowed":false,"csrf_tokens":{"/mcsrainbow/alibaba-cloud-icons/branches":{"post":"jcppAOF8p1aCX4RMXr5ruQ6ZEilSdVmC8KrkliIg2CAYvZBuDDvTwhuluU99IHwShovr69NVsStvK6bIZe7Xgg"},"/repos/preferences":{"post":"Y1X84kU5ru7c9FqwQEAWuCMBmj4YbqyO_g_VoTJ-pVFKNAdjXaRml0vSK-knhX0CxrtUe0X3UBmF_n1MWYHCpw"}}},"title":"alibaba-cloud-icons/README.md at main · mcsrainbow/alibaba-cloud-icon

iconfont.cn 阿里出品的矢量图标库-阿里云开发者社区

产品解决方案文档与社区权益中心定价云市场合作伙伴支持与服务了解阿里云售前咨询 95187-1 在线服务售后咨询 4008013260 在线服务其他服务我要建议我要投诉更多联系方式备案控制台开发者社区首页探索云世界探索云世界云上快速入门，热门云上应用快速查找了解更多问产品动手实践考认证TIANCHI大赛活动广场活动广场丰富的线上&线下活动，深入探索云世界任务中心做任务，得社区积分和周边高校计划让每位学生受益于普惠算力训练营资深技术专家手把手带教话题畅聊无限，分享你的技术见解开发者评测最真实的开发者用云体验乘风者计划让创作激发创新阿里云MVP遇见技术追梦人直播技术交流，直击现场下载下载海量开发者使用工具、手册，免费下载镜像站极速、全面、稳定、安全的开源镜像技术资料开发手册、白皮书、案例集等实战精华插件为开发者定制的Chrome浏览器插件探索云世界新手上云云上应用构建云上数据管理云上探索人工智能云计算弹性计算无影存储网络倚天云原生容器serverless中间件微服务可观测消息队列数据库关系型数据库NoSQL数据库数据仓库数据管理工具PolarDB开源向量数据库热门Modelscope模型即服务弹性计算云原生数据库物联网云效DevOps龙蜥操作系统平头哥钉钉开放平台大数据大数据计算实时数仓Hologres实时计算FlinkE-MapReduceDataWorksElasticsearch机器学习平台PAI智能搜索推荐人工智能机器学习平台PAI视觉智能开放平台智能语音交互自然语言处理多模态模型pythonsdk通用模型开发与运维云效DevOps钉钉宜搭支持服务镜像站码上公益

开发者社区

Segmentfault

文章

正文

iconfont.cn 阿里出品的矢量图标库

2021-11-15

2811

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《

阿里云开发者社区用户服务协议》和

《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写

侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

Iconfont.cn是阿里巴巴推出的矢量图标库，其中涵盖了1000多个常用图标，并在持续更新中。（目前已有7000+图标，部分图标为用户上传，因此默认不公开，但是可以搜索到。）

码农工程师

引入阿里iconfont图标方法以及注意事项 - 知乎

引入阿里iconfont图标方法以及注意事项 - 知乎切换模式写文章登录/注册引入阿里iconfont图标方法以及注意事项tuonioooo计算机技术与软件专业技术资格证持证人背景在我们做日常项目时，通常会用到icon图标或者是一些图标字体，阿里iconfont是我们选择的较多的一种，下面我将会介绍使用方法和几种常用的引用方式iconfont新建项目官网：https://www.iconfont.cn/ 在首页选择【图标管理】-【我的项目】点击【我的项目】填写项目信息，即可完成新建一个项目。【FontClass/Symbol 前缀】和【Font Family】参数是自定义的，以后会与我们生成的代码相关联，默认即可。添加图标新建好项目后，找到自己想要的图标，加入购物车。点击页面右上角的购物车图标，打开自己的购物车，选择添加至项目，我们就可以在自己的项目下看到添加的图标了。在我们的项目下，可以对图标进行编辑，如：大小、颜色、填充色，旋转等操作。Vue工程中引入iconfont官方文档：https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.15&helptype=code根据官方文档，有unicode引用、font-class引用、symbol引用三种引入方式，这三种方式又分有两种情况：下载到本地引入，在线链接引入。在Iconfont网页我们自己的项目下可以看到这些方式选择。unicode引用不推荐本地引入unicode方式代码量少，并不需要下载本地文件。链接引入unicode模式下的在线链接指的是font-face代码。在vue中，将项目生成的font-face代码和自定义的iconfont样式写在App.vue的style中，就可以在项目中引用图标了。此时样式是全局作用的，如果想要实现图标不同的样式，可以增加一层自定义样式。在”myIconStyle”样式中修改color等属性可以覆盖全局的样式，实现单个的样式修改。这里注意理解下，官方文档说的“不支持多色”，是指我们iconfont网页项目中，就算有多色图标，引用的时候会自动去色，统一变成默认的颜色，不管你给图标一编辑了红色图标二编辑了黄色，在项目中用unicode方式引用的时候都会变成默认颜色，但是我们仍然可以通过修改css样式实现图标颜色自定义，只是这个颜色编辑放在代码层面来了。font-class引用推荐使用如官方文档所说，font-class是为了让程序更加直观可读，直接用unicode会造成阅读困难。font-class模式关键在于生成的css文件。本地引入按照下图选择文件放入自己的项目中，vue中建议在assets文件夹下新建一个iconfont文件夹，放相关文件。常用的就是：iconfont.css、iconfont.ttf、iconfont.woff、iconfont.woff2@font-face {

font-family: "iconfont"; /* Project id 2974228 */

src: url('iconfont.woff2?t=1640340931514') format('woff2'),

url('iconfont.woff?t=1640340931514') format('woff'),

url('iconfont.ttf?t=1640340931514') format('truetype');

}再就是引入时，需要注意的是字体文件路径引用是否准确，否则打包可能不识别然后在main.js中引入iconfont.css文件，就可以正常使用了。import './assets/iconfont/iconfont.css'链接引入方式一：在index.html头部中，引入css文件即可方式二：点开css代码链接复制css代码，在项目中粘贴到iconfont.css文件中，在App.vue或main.js中引入import './assets/iconfont/iconfont.css'注意：iconfont.css中url 官方默认是cdn 链接, 打包时请改成http否则不识别@font-face {

font-family: "iconfont"; /* Project id 2974228 */

src: url('//at.alicdn.com/t/font_2974228_90efgxrmkr8.woff2?t=1639986814919') format('woff2'),

url('//at.alicdn.com/t/font_2974228_90efgxrmkr8.woff?t=1639986814919') format('woff'),

url('//at.alicdn.com/t/font_2974228_90efgxrmkr8.ttf?t=1639986814919') format('truetype');

}打包后@font-face {

font-family: "iconfont"; /* Project id 2400747 */

src: url('http://at.alicdn.com/t/font_2400747_k5sq86ts4b.woff2?t=1634895844844') format('woff2'),

url('http://at.alicdn.com/t/font_2400747_k5sq86ts4b.woff?t=1634895844844') format('woff'),

url('http://at.alicdn.com/t/font_2400747_k5sq86ts4b.ttf?t=1634895844844') format('truetype');

}symbol引用不推荐本地引入将下载好的iconfont.js文件放入自己的工程目录，在main.js中引入，在App.vue中写好通用css代码，即可使用。import './assets/iconfont/iconfont.js'这里注意一点，下载下来的js文件是压缩过的，如果项目使用了eslint语法校验会疯狂报错，可以在js文件开头加入 /* eslint-disable */来指定该文件不应用eslint校验。链接引入在index.html头部中，引入js文件即可uni-app 引入iconfont图标基本上引入方式跟上Vue相同，但是会遇到打包时图标引入不显示的问题，解决方式如下：1.在iconfont.css中，需要使*~@* 将路径添加完整@font-face {

font-family: "iconfont"; /* Project id 2642111 */

src: url('~@/static/fonts/iconfont.woff2?t=1625021641165') format('woff2'),

url('~@/static/fonts/iconfont.woff?t=1625021641165') format('woff'),

url('~@/static/fonts/iconfont.ttf?t=1625021641165') format('truetype');

}2.在App.vue全局引入iconfont.css3.使用图标，在标签内的class通过"iconfont icon-"添加下载好的图标即可或通过官方uni-icons 引入自定义图标

总结 symbol引用最受官方推荐，也是最优的方式，但是浏览器兼容不好，目前来看，前端需要兼容一些低版本的浏览器，所以如果考虑到用户使用，不建议采用symbol引用。 unicode引用浏览器兼容最好，但是可读性差，font-class引用虽然兼容性比unicode引用差一点，但是提高可读性，综合来看，目前项目中还是采用font-class引用比较好。因为引用网络资源的不稳定，所以建议采用本地引入的方式。如果在图标库中新增加了图标，则需要更新在线链接并把该链接重新引入到实际项目中，或者重新下载代码到本地，然后在实际项目中引入最新的iconfont文件。再就是引入时文件路径的问题，打包都需要注意。点击下方卡片/微信搜索，关注公众号“天宇文创意乐派”(ID:gh_cc865e4c536b)听说点赞和关注本号的都找到漂亮的小姐姐了哟且年后必入百万呀！！往期推荐分享6个实用的网站，非常Nice利用Vue 脚手架开发chrome 插件，太方便了！Vue类似hooks的新库VueUse使用NodeJs和JavaScript开发微信公众号再见 Swagger UI！国人开源了一款超好用的 API 文档生成框架，Star 4.7K+，真香！！JavaScript 细节和一些实际应用，了解一下本文使用文章同步助手同步编辑于 2021-12-27 22:54图标Icon Font阿里软件赞同 4添加评论分享喜欢收藏申请

开发常用图标阿里巴巴-矢量图标-阿里云开发者社区

开发者社区

云计算

文章

正文

开发常用图标阿里巴巴-矢量图标

2016-08-27

1577

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《

阿里云开发者社区用户服务协议》和

《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写

侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

阿里巴巴-矢量图标库此网站 1、能搜到官方和个人提供的优秀图标再也不用担心不会用photoshop~再也不用担心没图标，做不出界面了~ 2、能生成复杂的字体 IP地址：http://iconfont.cn/ 网站界面：转自：http://Www.CnBlogs.Com/WebEnh/ 感谢WebEnh的提供~ 作者：唐宋元明清2188出处：http://www.cnblogs.com/kybs0/本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须在文章页面给出原文连接，否则保留追究法律责任的权利。

阿里巴巴-矢量图标库

此网站

1、能搜到官方和个人提供的优秀图标

再也不用担心不会用photoshop~再也不用担心没图标，做不出界面了~

2、能生成复杂的字体

IP地址：http://iconfont.cn/

网站界面：

转自：http://Www.CnBlogs.Com/WebEnh/

感谢WebEnh的提供~

作者：

唐宋元明清2188

出处：

http://www.cnblogs.com/kybs0/

本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须在文章页面给出原文连接，否则保留追究法律责任的权利。

@winter

图标库的正确使用方式-阿里云开发者社区

开发者社区

开发与运维

文章

正文

图标库的正确使用方式

2022-12-05

317

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《

阿里云开发者社区用户服务协议》和

《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写

侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

今天来教大家在实际开发中引入图标库

猪痞恶霸

Just a moment...

a moment...Enable JavaScript and cookies to conti

阿里图标库的使用方法 - 知乎

阿里图标库的使用方法 - 知乎切换模式写文章登录/注册阿里图标库的使用方法杰哥来了关于生命的一些思考......阿里图标库的使用方法一. 登录阿里图标库官网https://www.iconfont.cn/二. 搜索使用的图标这里需要注意，在下载图标之前需要注册登录账户三. 下载素材将图标添加入库，然后点击添加至项目，如果没有项目需要创建一个，然后选择下载至本地四. 操作打开本地下载目录(注意将解压后的文件保存到项目文件对应的目录当中)，打开demo_index.html文件，选择第二项按要求导入标签最后将图标名称以 icon-xxx的形式相结合，配置到页面当中发布于 2020-12-21 21:02CSS赞同 11 条评论分享喜欢收藏申请

超实用的矢量图标库，你知道几个？ - 知乎

超实用的矢量图标库，你知道几个？ - 知乎首发于黑摄会切换模式写文章登录/注册超实用的矢量图标库，你知道几个？Boyka一介书童，颜良而文丑。

合作请私。都是设计师的最爱~① IconFont:阿里巴巴矢量图标库链接：http://www.iconfont.cn/IconFont:阿里巴巴矢量图标库是由阿里巴巴体验团队倾力打造的中国第一个最大且功能最全的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能。内含矢量图标近百万个，是设计师和前端开发的便捷工具。在我们需要图标的时候直接输入关键字搜索即可，例如：输入“高跟鞋”，便找到了359个相关图标，图标颜色可以根据喜好自行调配。下载格式支持SVG、AI、PNG。同时，Iconfont是一个去中心化的平台，支持用户自行上传图标、收藏图标以及管理项目图标，总体而言非常实用。② IconFinder-Free Icons链接：https://www.iconfinder.com/free_icons网站包含超过十万个免费图标，每个图示旁边都有标示使用授权与说明，大部分都可以免费使用在个人或商业用途。同时，网站无需注册即可使用。③ Find Icons链接：http://findicons.com/Find Icons，号称全球最大的图标搜索引擎，网站涵盖了2677个图标集和475450个图标。该站支持中文浏览，但是关键字搜索只能使用英文。同样无需登录，即可免费下载多种版本的图标。④ Vexels链接：https://www.vexels.com/这个网站提供了大批的高质量免费矢量图资源，搭配上标签、分类和搜索，你可以轻松找到自己需要的图片。其中可免费下载的矢量文件包括:矢量图标、矢量图案、矢量漩涡、花形图案、背景、笔刷等等。进入免费矢量图界面后，点击Download 后即可下载压缩包文件，此网站无需注册即可正常使用。⑤ Icons8链接：https://icons8.com/Icons8，来自国外的矢量图标库，使用方式和Find Icons差不多，都是直接输入关键字进行搜索。网站资源丰富，涵盖4万个原创矢量图标，支持分类搜索，并且可以选择合适的图标尺寸进行下载，实用性一流。如需获得更多实用网站推荐或者修图使用技巧，可以翻看我的其余文章 ∩▂∩ ，谢~编辑于 2017-02-13 14:58设计互联网Adobe Photoshop赞同 117820 条评论分享喜欢收藏申请转载文章被以下专栏收录黑摄会从拍摄到后期，将光与影演绎出夺

Follow

tokenpocket下载官方app下载|阿里云图标库官网

tokenpocket下载官方app下载|阿里云图标库官网

iconfont-阿里巴巴矢量图标库

产品图标

iconfont.cn 阿里出品的矢量图标库-阿里云开发者社区

引入阿里iconfont图标方法以及注意事项 - 知乎

开发 常用图标 阿里巴巴-矢量图标-阿里云开发者社区

图标库的正确使用方式-阿里云开发者社区

Just a moment...

阿里图标库的使用方法 - 知乎

超实用的矢量图标库，你知道几个？ - 知乎

最近的新闻

您可能喜欢的文章

比特派官网安卓版下载|idr是什么货币

tp钱包中国官方网站|competitive

比特派钱转不出去怎么解决

比特派怎么提现到银行卡

比特派要怎么提现到微信

比特派钱包权限怎么改回来

比特派怎么设置英文名字

开发常用图标阿里巴巴-矢量图标-阿里云开发者社区