前端项目里的图标库常面临两难选择：Font Awesome 免费版约 2000 个图标，但风格混杂、文件臃肿；自己绘制 SVG 视觉统一，却耗时费力。Feather Icons 提供了第三条路。它只保留约 287 个最常用图标，全部限定在 24×24 网格内绘制，描边、圆角与视觉重量严格统一，并以 MIT 协议免费商用。
feather.replace() 才是真正的杀手锏
Feather 最有价值的能力并非纯 SVG 下载，而是内置的 JavaScript API。开发者只需在 HTML 元素上添加 data-feather="activity" 属性，再调用一次 feather.replace()，整页所有占位符就会被对应 SVG 替换。这种“声明式图标”写法更贴近现代前端框架思路：你描述“这里要什么图标”，库负责把它渲染出来，无需手动管理路径或在模板中堆砌 <svg> 字符串。
该 API 还暴露了 feather.icons 对象，可遍历全部图标的元数据，配合构建工具实现按需打包。引入方式灵活：CDN 直接可用，npm 安装只需 npm install feather-icons。单文件 gzip 后约 8KB，首屏成本几乎可以忽略。
三个值得记住的事实
- 全部图标基于 24×24 像素网格绘制，描边默认 2px，圆角与间隙遵循统一规范，混用不会出现风格冲突
- MIT 许可证，商用免署名，可直接用于闭源项目内嵌
- 由设计师 Cole Bemis 创建并维护至今，GitHub Star 数累计超过 2 万
这些场景 Feather 帮不了你
图标总量只有约 287 个，这是它最常被提及的局限。如果项目需要品牌 logo、彩色插画或行业垂直图标（如医疗、能源、工业控制等领域），Feather 基本覆盖不到，需转向 IconPark（2400+）或 Font Awesome 付费版（20000+）。它也不支持多色或实心与线性形态切换，每个图标仅提供一种线性样式。
复杂矢量编辑仍需回到 Figma 或 Sketch 等专业工具。此外，官方网站偶有加载缓慢的反馈，生产环境建议直接通过 Unpkg 或 JsDelivr 的 CDN 引入。
