google/material-design-icons

这是什么？

核心功能

• 01提供两套图标：Material Symbols（当前版本，可变字体）和 Material Icons（经典版，已停止更新）。
• 02Material Symbols 支持调整光学尺寸、字重、等级和填充参数。
• 03Material Icons 包含线框、填充、圆角、锐角和双色五种风格。
• 04提供 SVG、PNG、网页字体、Android 和 iOS 等格式。
• 05可通过 Google Fonts 托管链接引用，也可下载文件直接使用。

适用场景

• 为网页应用添加风格统一的图标集。
• 通过 CSS 类名或 Google Fonts 链接在网站中使用图标字体。
• 在 Android 或 iOS 应用中使用 Material 风格的图标。
• 借助可变字体设置，在 CSS 中调整图标字重或填充状态。

快速上手

1. 1

   打开 Material Symbols 图标浏览器挑选图标

2. 2

   安装社区维护的 SVG 图标 npm 包

   npm install @material-design-icons/svg
3. 3

   或在 HTML 中引入 Google Fonts 的网页字体

   <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet">

使用前须知

• !Material Icons 已不再更新，新图标只会出现在 Material Symbols 中。
• !npm 包由第三方维护，并非 Google 官方维护。

标签

常见问题

material-design-icons 是什么？

Google 官方 Material Design 图标库，提供 Material Symbols 与经典 Material Icons 两套图标。 本仓库收录 Google 官方的 Material Design 图标，分为两套。Material Symbols 发布于 2022 年，是当前主推的版本，基于可变字体技术构建，支持调整光学尺寸、字重、等级和填充等参数。Material Icons 是经典版本，提供线框、填充、圆角、锐角和双色五种风格，已不再更新。

material-design-icons 可以免费使用吗？用的什么许可证？

material-design-icons 以 Apache-2.0 许可证开源。用于商业产品前，请先确认许可证条款。

material-design-icons 还在维护吗？

活跃维护中。material-design-icons 最近一次提交是在 2026年10月9日。

material-design-icons 适合用来做什么？

为网页应用添加风格统一的图标集。 通过 CSS 类名或 Google Fonts 链接在网站中使用图标字体。 在 Android 或 iOS 应用中使用 Material 风格的图标。 借助可变字体设置，在 CSS 中调整图标字重或填充状态。

material-design-icons 怎么安装和运行？

打开 Material Symbols 图标浏览器挑选图标 安装社区维护的 SVG 图标 npm 包: npm install @material-design-icons/svg 或在 HTML 中引入 Google Fonts 的网页字体: <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet">

在哪里获取 material-design-icons？

源代码和安装说明在 GitHub 上：https://github.com/google/material-design-icons