【效率】大厂出品免费图标资源站

IconPark 字节跳动出品矢量图标样式的开源图标库

编程导航开源仓库:https://github.com/liyupi/code-nav

IconPark 图标库是一个通过技术驱动矢量图标样式的开源图标库,可以实现根据单一 SVG 源文件变换出多种主题, 具备丰富的分类、更轻量的代码和更灵活的使用场景;致力于构建高质量、统一化、可定义的图标资源,让大多数设计师都能够选择适合自己的风格图标,并支持把图标源文件导出为React、Vue2、Vue3、SVG 多种形式的组件代码,让开发者使用更加高效快速。

IconPark 提供超 2000+ 高质量图标,免费使用,根据单一 SVG 源文件变换多主题,包括:线框、填充、双色、多色,无需使用 4 种风格的SVG 文件。

IconPark官方图标库,可以跨平台导出多种图标组件代码,包括React、Vue2、Vue3 格式,很方便前端学使用。

IconPark 依照主题分类,基础图标,办公,编辑,餐饮,服饰等分类供大家使用,选择自己喜欢的图标,复制 SVG,React,Vue 代码,或是下载 SVG,PNG 即可。

在 Sketch\Figma 中使用

对图标配置不同属性,拷贝SVG源码。

粘贴到Sketch软件中使用。

在PPT、Word等使用

可以下载图标对应的PNG格式,就可以在PPT、Word等里面使用啦。

React 开发者怎么使用

可以直接复制 React 代码:

示例代码如下:

// 引用
import {CheckOne} from '@icon-park/react'
//调用
<CheckOne theme="filled" size="32" fill="#17bd08"/>

Vue 开发者怎么使用

可以直接复制 React 代码:

示例代码如下:

// 引用
import {CheckOne} from '@icon-park/vue'
// 调用
<check-one theme="filled" size="32" fill="#17bd08"/>

此前也为大家推荐过 IconFont,其实两者还是有一定差距的,大家可以选择在不同的场景选择不同的利器,从而完善自己的作品,下面为大家分析一下两者的区别~

和阿里 IconFont 有什么区别?

  1. IconFont 图标数量非常丰富在 Sketch\Figma 中使用,支持用户侧上传图标及项目管理,IconPark 是官方提供的规范化、统一化的高质量图标库,即前者侧重 UGC,后者 PGC。

  2. IconPark 官方图标库 2300+ 个图标均支持风格属性变换,可对图标大小、颜色、线框粗细等属性进行设置,填充/多色随意转换,可根据单一 SVG 变换生成多套主题(仅使用了 1 个 SVG 源文件哦),与 IconFont 相比 IconPark 给用户开放了更多的图标设置功能;

  3. IconPark 官方图标库,可以跨平台导出多种图标组件代码,包括 React、Vue2、Vue3 格式,尤其是在 B 端场景下,很方便前端同学使用。

大家可以搭配 IconFont 一起使用,为自己页面添姿增彩,快去使用叭~

⬇️ 点击下方阅读原文查看项目


往期精彩回顾



适合初学者入门人工智能的路线及资料下载机器学习及深度学习笔记等资料打印机器学习在线手册深度学习笔记专辑《统计学习方法》的代码复现专辑
AI基础下载机器学习的数学基础专辑温州大学《机器学习课程》视频
本站qq群851320808,加入微信群请扫码:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值