How to implement Material Symbols in Figma

A step by step guide on adding and using Google's Material Symbols in a Figma project.

Oscar de la Hera Gomez
Written by Oscar de la Hera Gomez
First published on 06/27/2023 at 12:39
Last Updated on 07/26/2023 at 11:56
A flower that represents Figma with the text "Material Symbols" beneath it.

A step by step guide on adding and using Google's Material Symbols in a Figma project.

SubscribeWhat are Symbols?

Step One: Run the Material Symbols Plugin

A screenshot of Figma highlighting the Resources tab on the top menu bar. We have also shown the pop up that appears and have inputted "Material Symbols" into the search bar. The results that appear show the "Material Symbols" plugin as the first option, and we have highlighted the "Run" button that appears when you place your cursor over the menu item, allowing you to open the plugin.

In the Figma project, open the Resources tab.

In the pop up that appears, select Plugins and search for Material Symbols.

Click Run.

Visit the Material Symbols Figma Community Page

Step Two: Implement a Material Symbol

A screenshot of Figma showing the Material Symbol plugin window. We have searched for "exit" and have selected an exit symbol that matches our wishes. This symbol now appears in the Figma project.

In the Modal that appears, search for the glyph that you wish to use and click the relevant icon to add it to your project.

Discover our free iOS and Android e-commerce template

Any Questions?

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.
SubscribeContact UsVisit our BlogView our ServicesView our Work

Partner with us

We would love to get to know you and see how we can help your organization with its goals and needs.
Let's Talk

Stay Informed

Get occasional updates about our company, research, and product launches.
Subscribe