Iconoir - 免费开源、优雅高颜值的图标库，支持免费商用和二次修改

AI科技 2025年07月27日 19:50 0 admin

设计师、前端开发者看过来，一套好看好用的图标库推荐给你们。

Iconoir图标库

Iconoir 是一个应用图标库，图形设计非常简洁，但辨识度很高，很实用。自2020年推出以来，一直在更新图标，截止我今天写这篇文章为止，已经拥有1600+高质量的图标，从基础功能操作到行业场景（如商业、金融）的图标都应有尽有，覆盖面广，被很多设计师和开发者用在各种 web / 移动应用界面上。

Iconoir 官网

值得推荐的理由

使用友好：提供可修改的SVG文件、React / Vue 前端组件、满足跨平台开发需求；
风格一致：所有图标遵循统一设计规范，视觉和谐，最重要是颜值够高；
填充样式：很多图标都提供了线框和填充样式，方便实现多种 UI 的交互状态。

上手使用体验

设计师使用

Iconoir 网站首页的左侧有两个快捷工具，一是调整图标尺寸，二是调整线框宽度，调整后的图标会体现在导出的 SVG 文件中，保留完美像素效果，这样批量调整就不用再导入到设计软件中调整了，方便。

不过要注意的是，Iconoir 图标的填充样式很好看，我个人很喜欢，但不是每一个图标都有填充样式。

图标列表

前端开发使用

Iconoir 对前端开发者非常友好，提供了多种方式安装：

npm	Yarn	pnpm	Bun
npm i iconoir	yarn add iconoir	pnpm add iconoir	bun add iconoir

集成方式以及命令一览表

以我熟悉的 Vue 为例，集成到项目中很简单。先安装：

npm i @iconoir/vue

再 Vue 页面中使用：

<template>  <Iconoir color="red" height="36" width="36" /></template><script setup>  import { Iconoir } from '@iconoir/vue';</script>

另外还支持更多用法，比如通过 Tree Shaking 仅导入使用到的图标组件，甚至还可以通过更简单的 CSS 来使用，具体可以参考官网的文档。

免费开源与商用说明

Iconoir 是一个免费开源的图标项目，采用 MIT 开源协议，我们可以免费下载来使用，可以自由用在商业项目上，二次修改也没问题。

↓↓点击查看本次分享的网站。

Iconoir - 免费开源、优雅高颜值的图标库，支持免费商用和二次修改｜那些免费的砖

2nm太抢手，台积电疯狂扩产

面试官问：MySQL 为什么不能用 Docker 部署吗？答错直接挂！

发表评论