v1 · 2,400 个图标 · 五种字重

一套图标。
从边缘分发。

Iconhaus 维护一套统一的图标库——五种字重、同一网格——并按内容寻址，从离用户最近的区域分发每个图标。引入组件或直接链接 SVG，其余交给缓存。

安装

npm i @iconhaus/react

import { Glyph } from "@iconhaus/react"
<Glyph name="compass" weight="bold" size={24} />

2,400 个图标5 种字重38 个区域11 毫秒 中位取用

浏览图标集

图标库的一部分——同一网格、五种字重、同一套视觉语言。每个图标都是不到半 KB 的 SVG。

图标 CDN 应有的一切

设计系统需要、却没人愿意手动搭建的部分：字重、分发、按需引入，以及可锁定的版本。

五种字重，同一网格

细、轻、常规、粗、重——绘制在同一 24 像素网格上，因此混合字重的一行依然对齐。

从边缘分发

每个图标按内容寻址，在 38 个区域不可变缓存。你无需改动任何设置即可就近获取。

按需引入或直接链接

引入单个组件只打包用到的图标，或在无需构建步骤时直接链接原始 SVG。

锁定版本

每个版本都被冻结。你决定何时升级；锁定的标签不会在你脚下改变形状。

按需构建的自定义子集

只请求你真正用到的图标，我们为你构建子集。构建是异步的——轮询它，并在每个部分就绪时取用。

轮询子集构建

# subsets are built asynchronously — poll until the parts are ready
GET /api/v1/subsets/9f2c1ab4e07d4c8fa1b3d65e08c47a12

200 OK  ·  cache-control: no-store
{ "state":"building", "parts":12, "ready":7 }

# then pull each part as it lands
GET /api/v1/subsets/9f2c1ab4e07d4c8fa1b3d65e08c47a12/7

为设计系统而建

天生统一

每个图标发布前都通过相同的网格、基线与视觉字重检查。不会有落单的 23 像素异类。

在关键处更快

38 个区域的中位取用 11 毫秒，数据来自浏览器，而非我们自己的探针。

API 优先

站点能做的一切都是有文档的接口。提供 React、Vue、Svelte 与纯 SVG 的包。

融入你现有的工具

ReactVueSvelteFigmaTailwindSwiftUIFlutterWeb Components

获取密钥，今天就发布一个图标

免费套餐包含 50 GB 分发量与整个图标库，无需署名。

获取密钥阅读文档

一套图标。从边缘分发。