Material Symbols for Home Assistant

Material Symbols for Home Assistant is a collection of 15,804 Google Material Symbols for use within Home Assistant. It uses the icon-set produced and maintained by iconify.

There is a Icon Finder Tool to help you select the correct icon. Simply type in what you're looking for, click the icon of choice, and the icon entry for home assistant will be copied to your clipboard (e.g., m3o:light). The copied text can be pasted for use in your YAML configuration or into you UI frontend interface.

           

To see how to complete the migration from repository (v1.X.X) to an "Integration" repository (202X.X.X+), please visit the Migration documentation.

Table of Contents

• Table of Contents
• Installation
  • HACS Installation (Recommended)
  • Manual Installation
• Usage
  • Example
• Community
• Troubleshooting
• Feedback and Contributions
• Thanks
  • Stargazers
• Copyright and Licence
  • Licence Summary

Installation

HACS Installation (Recommended)

Note: Material Symbols is now installable via HACS as a Default Integration 🥳.

1. First, tap on the integration repository quick-link below and install:

   

2. Then the next setup quick-link below to complete the setup configuration:

   

3. After the installation completes, restart Home Assistant to load the new integration.

   • You're browser cache may need to be deleted to show the icons as desired.

---

Manual Installation

If you prefer to install the integration manually:

1. Download the Integration:

   • Download the material_symbols folder from the custom_components directory of this repository.

2. Copy to Home Assistant:

   • Place the material_symbols folder into your Home Assistant config/custom_components/ directory. The final path should be config/custom_components/material_symbols/.

3. Restart Home Assistant:

   • Restart Home Assistant to load the new integration.

4. Add Integration to Devices & Services:

   • In the Home Assistant Settings menu, select Devices & Services.
   • Tap the + Add Integration button.
   • Search for Material Symbols and select it.
   • This should now show as successfully configured.
   • Tap Finish.

5. Restart Home Assistant:

   • Restart Home Assistant to complete the setup.

Usage

Once installed, you can use the Material Symbols icons in your Lovelace UI.

The icons come in six distinct styles, each with its own prefix:

• Outlined: m3o
• Outlined and filled: m3of
• Rounded: m3r
• Rounded and filled: m3rf
• Sharp: m3s
• Sharp and filled: m3sf

Using an Icon:

In your entity configuration, specify the icon using the appropriate prefix and icon name:

icon: 'prefix:icon_name'

Replace prefix with one of the prefixes above and icon_name with the desired icon. There is a Icon Finder Tool to help you select the correct icon for your needs.

Example

type: entities
title: Lights
entities:
  - entity: light.living_room
    name: Living Room Light
    icon: 'm3o:light'
  - entity: light.kitchen
    name: Kitchen Light
    icon: 'm3of:light'
  - entity: light.bedroom
    name: Bedroom Light
    icon: 'm3r:light'
  - entity: light.garage
    name: Garage Light
    icon: 'm3rf:light'
  - entity: light.porch
    name: Porch Light
    icon: 'm3s:light'
  - entity: light.garden
    name: Garden Light
    icon: 'm3sf:light'

Community

Join the discussion on the Home Assistant Community Forum.

Troubleshooting

If you're experiencing issues with icons not loading or displaying correctly, please refer to our comprehensive Troubleshooting Guide.

The troubleshooting guide covers:

• Icons not loading after page refresh
• Mobile app compatibility issues
• Browser console debugging
• Performance optimisation
• Step-by-step debugging instructions

For quick fixes:

• Clear browser cache and hard refresh (Ctrl+Shift+R)
• Restart Home Assistant after installation
• Check that the integration shows as "Configured" in Settings → Devices & Services

Feedback and Contributions

If you encounter issues or have suggestions, please open an issue on GitHub. Contributions are welcome! Feel free to submit pull requests.

Thanks

• Big thanks to @vigonotion and his repository hass-simpleicons and @thomasloven for his repository hass-fontawesome, of which this integration and github repository is based.
• Thanks to OpenAI and ChatGPT their LLM 01-preview for assistance in resolving issues during development.

Stargazers

Copyright and Licence

This work is licenced under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

Licence Summary

• Attribution: You must give appropriate credit, provide a link to the licence, and indicate if changes were made.
• NonCommercial: You may not use the material for commercial purposes.
• ShareAlike: If you remix, transform, or build upon the material, you must distribute your contributions under the same licence.