---
url: /styles/icons/overview.md
description: Icons are small symbols to easily identify actions and categories
---

# Icons

Icons are small symbols to easily identify actions and categories

**Overview** · [Designing icons](designing-icons.md) · [Applying icons](applying-icons.md)

![Icons](/assets/511d9036-mroe74iw-customizing-material.CkhM5CLW.webp)

* Get Material Symbols icons at [fonts.google.com/icons](https://fonts.google.com/icons). Recolor, resize, and copy and paste icons.
* Use the Material Symbols variable font to enable dynamic styling in product
* You can change the weight, fill, optical size, and grade of variable font icons

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm15hl4wg-m0zqu7hk-GM3-Styles-Icons-GoogleSymbols-1-v01.mp4?alt=media" aria-label="Array of icons with various stylistic attributes."></video>

## Resources

| Type   | Link                                                                                                               | Status    |
| ------ | ------------------------------------------------------------------------------------------------------------------ | --------- |
| Design | [Icons catalog](https://fonts.google.com/icons)                                                                    | Available |
| Design | [Material Symbols Figma plugin](http://goo.gle/material-symbols-figma)                                             | Available |
| Design | [Icon keyline template (ZIP)](https://storage.googleapis.com/material-io-design/downloads/gm_icon_template.ai.zip) | Available |

## What's new

### Copy & paste customized Material Symbols

You can now copy and paste icons from [Google Fonts](http://fonts.google.com/icons). Once you search for and select the desired icon, options will appear in the right-hand panel to resize, recolor, and copy the customized icon to clipboard.

![Panel showing options to size, recolor, and copy selected icon.](/assets/0db4eebb-mltc6k61-01.BmdJf_S1.webp)

Icons can now be copied with a single click

### Material Symbols

The new variable icon font set supports three styles: **outlined**, **rounded**, and **sharp**. All Material Symbols are newly drawn to be pixel-crisp and modernized.

![Twelve icons depicted in three styles: outlined, with rounded corners, and sharp.](/assets/1d7605e8-mltc9xz0-3p-overview-lg.Cl68a94x.webp)

1. Outlined 
2. Rounded 
3. Sharp

### Adjustable axes

Material Symbols have four adjustable stylistic variable font attributes called **axes**. An axis refers to an attribute of a symbol that can be altered to create visual variations. The attributes are: weight, fill, optical size, **grade**.

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm15hn3i9-m0zqvlds-GM3-Styles-Icons-GoogleSymbols-3-v01.mp4?alt=media" aria-label="Four icons shown with adjusted weight, fill, grade, and optical sizes."></video>

A range of symbols shown with the same weight, fill, grade, and optical sizes

### Material Symbols Figma plugin

Easily [incorporate Material Symbols](http://goo.gle/material-symbols-figma) into your latest designs on Figma.

![Screenshot of Material Symbols plugin in Figma.](/assets/22a076b5-mltcduhy-3p-figma-lg.D31HQ1YZ.webp)

Figma Symbols plugin