---
productId: material-ui
components: Icon, SvgIcon
materialDesign: https://m2.material.io/design/iconography/system-icons.html
packageName: '@mui/icons-material'
githubLabel: 'package: icons'
---

# Material Icons

<p class="description">2,100+ ready-to-use React Material Icons from the official website.</p>

{{"component": "@mui/docs/ComponentLinkHeader"}}
<br/>

[@mui/icons-material](https://www.npmjs.com/package/@mui/icons-material)
includes the 2,100+ official [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) converted to [`SvgIcon`](/material-ui/api/svg-icon/) components.
It depends on `@mui/material`, which requires Emotion packages.
Use one of the following commands to install it:

<!-- #npm-tag-reference -->

<codeblock storageKey="package-manager">

```bash npm
npm install @mui/icons-material @mui/material @emotion/styled @emotion/react
```

```bash pnpm
pnpm add @mui/icons-material @mui/material @emotion/styled @emotion/react
```

```bash yarn
yarn add @mui/icons-material @mui/material @emotion/styled @emotion/react
```

</codeblock>

See the [Installation](/material-ui/getting-started/installation/) page for additional docs about how to make sure everything is set up correctly.

:::info
Google offers [Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols) as the successor to Material Icons. However, `@mui/icons-material` currently supports only Icons, with no support for Symbols yet.
:::

<hr/>

## Search Material Icons

Browse through the icons below to find the one you need.
The search field supports synonyms—for example, try searching for "hamburger" or "logout."

{{"demo": "SearchIcons.js", "hideToolbar": true, "bg": true}}