Material Design Icons: Google's icon library
/material-design-icons
Material Design Icons is Google's official icon library: the actively updated Material Symbols variable fonts plus the frozen Material Icons classic set. Reach for it when you're building in the Material Design visual language and want free Apache 2.0 icons with no attribution required; skip it if you need an icon Google hasn't drawn, since new submissions aren't accepted.
What are Material Design Icons and Material Symbols?
Material Design Icons is the umbrella name for two related icon sets Google publishes on GitHub: Material Symbols, introduced in April 2022 as variable fonts, and Material Icons, the older static set that stopped receiving new icons that same year. Both cover the same visual language and ship as SVG, font, and (for Symbols) variable-font files under an Apache 2.0 license.
Material Symbols vs Material Icons: what is available
- ✓Material Symbols ships as three variable fonts — Outlined, Rounded, Sharp — each covering the optical size (20-48, default 24), weight (100 Thin to 700 Bold, default 400), grade (-50 to 200, default 0), and fill (0-100, default 0) axes.
- ✓There's no separate Filled font for Material Symbols. You push the Fill axis to 100 instead, and animating that axis gives you a fill-in selection effect.
- ✓Material Icons keeps five fixed styles — Outlined, Filled, Rounded, Sharp, Two tone — with no variable axes at all.
- ✓The repo splits by set: `symbols` and `variablefont` hold Material Symbols files, while `android`, `font`, `ios`, `png`, and `src` hold Material Icons files.
- ✓Both sets are browsable at fonts.google.com/icons, with a dropdown that switches between Material Symbols (the default) and Material Icons.
- ✓Apache 2.0 covers both sets — attribution is welcomed, not required.
What Material Symbols and Material Icons do not include
- △Material Icons — the older font with five styles — hasn't gained a new icon since Google halted updates on it in 2022; anything newer only exists in Material Symbols.
- △You can't design an SVG and open a pull request for it. Google generates icons from its own upstream source files and only takes concept requests as GitHub issues.
- △The npm packages that make `npm install` possible (material-symbols, material-icons, and the @material-design-icons scoped packages) are community-run by @marella, not reviewed by Google.
- △Material Symbols drops two-tone icons entirely, and only the 20/24px sizes get pixel-grid alignment; Material Icons has no variable weight, grade, or animated fill.
Using the icons on the web with Google Fonts
The easiest path is Google Fonts' CDN: link a stylesheet and reference the icon by name or ligature in your CSS, no build step required. For Material Symbols: <link href='https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined' rel='stylesheet'>. For the classic set: <link href='https://fonts.googleapis.com/css2?family=Material+Icons' rel='stylesheet'>. If you'd rather self-host, the `font` and `variablefont` folders in this repo hold pre-generated font files you can bundle directly, and `symbols`, `android`, `ios`, `png`, and `src` hold the raw SVG and per-platform assets. Google itself doesn't publish an npm package past v3 (2016); `npm install` here means pulling from @marella's community-maintained material-symbols, material-icons, @material-design-icons/font, or @material-design-icons/svg packages instead — auto-published via GitHub Actions but not reviewed by Google. Everything is Apache 2.0, so commercial use is fine without asking; the README says attribution in an about screen is appreciated, not required.
Who should use Material Design Icons
Reach for this if you're building on Material Design (M2 or M3) — Android apps, Flutter, or web dashboards that want icons matching Google's own grid and naming. It's a weaker fit if your product uses a custom visual language Material Symbols won't blend into, or if you need brand and product logos. Logos aren't included, full stop — Google drops third-party logos for legal reasons.
Alternatives to Material Design Icons
Frequently asked questions
Material Design Icons ships under the Apache License 2.0, so commercial use is allowed without payment or permission. The README says attribution in your app's about screen is appreciated but not required.
Link the Google Fonts stylesheet — <link href='https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined' rel='stylesheet'> — then set the font-variation-settings axes (opsz, wght, GRAD, FILL) in your CSS to control size, weight, grade, and fill.
Material Symbols is the current set, built as variable fonts since April 2022 with adjustable weight, grade, fill, and optical size; Material Icons is the older, frozen set with five fixed styles and no icons added since updates halted in 2022.
You can open a GitHub issue describing the concept, but Material Design Icons doesn't accept pull requests with finished SVG designs — Google generates icons from its own upstream source files and reviews concepts, not ready-made artwork.
Google's own npm package for Material Icons stopped being maintained after v3 in 2016. Community packages like material-symbols and material-icons from @marella cover npm installs now, auto-published via GitHub Actions but not reviewed by Google.
Material Design Icons includes dedicated `android`, `ios`, and `png` folders in the repo alongside the fonts, so both platforms are directly supported — Material Symbols and Material Icons are the icon sets Android's own Material Design guidelines are built around.
Best use cases
- •Android and iOS apps built on Material Design, pulling assets straight from the `android`/`ios` folders.
- •Web dashboards that link the Google Fonts CDN and swap the Fill axis for a selected state instead of swapping icon files.
- •Design systems that need one icon shape at multiple weights — Thin for secondary UI, Bold for primary actions — from a single variable font.
- •Self-hosted setups that skip the Google Fonts network request, using the `font`/`variablefont` folders or the SVGO-optimized SVGs from @material-design-icons/svg.
Related repositories
Want a second opinion on material-design-icons?
Ask an AI that can read this page — one click and you get its take on material-design-icons.