跳到内容
分享网

Google 官方图标:Material Symbols 免费,还能调粗细和圆角

设计素材 Web 12 天前更新 浏览 2 ↓ 直达下载
Google 官方图标:Material Symbols 免费,还能调粗细和圆角

谷歌的 Material 图标经历了三代,现在的 Material Symbols 是可变的:粗细、字号、圆角、填充程度都能通过参数调,一个图标能演化出很多种长相。

它解决什么问题

图标风格与产品调性不匹配时,通常只能换库;换库意味着重新对齐所有尺寸与视觉重量。

有些图标库的「填充态」与「描边态」不是同一套设计,切换后图形结构会变。

核心能力

能力 具体能做到什么
四轴可调 Weight(粗细)、Grade(视觉灰度)、Optical Size(尺寸适配)、Fill(填充程度)都可调
填充连续变化 Fill 轴可以从描边平滑过渡到实心,做动效与状态切换很方便
覆盖极广 数千个图标,覆盖 Google 生态与常见界面语义
多平台可用 可在 Android、Web、Flutter 等平台使用,也有 SVG 与 PNG 下载
Google 维护 随 Material Design 规范一起维护,风格稳定
Apache 2.0 商业使用免费,允许修改

可变图标的价值在哪

传统图标库是「一图一文件」,你只能在给定的几档里挑。可变图标是「一图多参数」,同一个图标文件通过参数长出很多变体。

这在做状态过渡时很有用:比如收藏按钮从描边变成实心,传统做法是两个图标切换,可变图标可以做连续动画。代价是可变字体文件略大,且部分旧环境支持有限。

同类工具怎么选

工具 授权 差别在哪
Tabler Icons 开源免费 静态 SVG,数量大,风格简洁
Phosphor Icons 开源免费 以六种独立字重文件的方式提供类似弹性
Lucide 开源免费 线条统一,适合非 Material 风格的产品

谁适合用

  • 做 Android / Flutter 应用的开发者
  • 需要大量图标且希望风格与 Google 生态一致的人
  • 要做图标状态过渡动效的设计与前端

怎么开始

  1. 打开 fonts.google.com/icons,搜索需要的语义。
  2. 在右侧面板调整四个轴的参数,实时预览。
  3. 需要静态图标就下载 SVG 或 PNG;网页使用可引入可变字体。
  4. Android 项目可直接使用官方 Material Symbols 依赖。

常见问题

和 Material Icons 是什么关系?
Material Symbols 是 Material Icons 的升级版,引入可变轴与更统一的造型。

商用需要署名吗?
Apache 2.0 不强制署名,但需保留许可说明。

旧浏览器支持吗?
可变字体的可变轴在较老的浏览器上可能不生效,会退化为默认字重;关键场景建议直接用静态 SVG。

授权与合规

Material Symbols 由 Google 以 Apache License 2.0 发布,可免费用于个人与商业项目。 官网:fonts.google.com/icons

资源信息
界面语言 多语言
授权方式 官方免费资源
适用平台 Web
获取方式 直链下载
资源更新 2026-09-19
页面更新 2026-09-06

获取资源

点击下方按钮直接开始下载。

立即下载
直链 https://fonts.google.com/icons