logo elektroda
logo elektroda
X
logo elektroda

How do I change the entity icon in Home Assistant? MDI icons - Material Design Icons

p.kaczmarek2 
Screenshot showing 12 different heart-themed icons from the Material Design Icons set in various styles with names below each icon. .
Home Assistant is a popular, open source home automation system that allows the integration and personalisation of many different systems and series of devices. One simple but effective way to personalise the HA interface is to change the icons assigned to entities, such as switches, sensors or lights. Home Assistant uses icons from the MDI (Material Design Icons) set. These are icons developed according to Material Design guidelines from Google.

You can use them in Home Assistant by prefixing the icon name with the prefix mdi:. For example:
- mdi:camera - camera icon
- mdi:account - account icon (human)
- mdi:alarm-light - alarm light
- etc.

The easiest way in Home Assistant is to change the icon for an already paired device. It can be added earlier through Home Assistant Discovery. Click on its icon:
Screenshot of the Home Assistant panel showing the Sensors section, with a red arrow pointing to the icon next to Apparent Power. .
Then we enter the settings:
Screenshot of a Home Assistant entity card showing a graph and the settings button highlighted. .
We select the icon from the drop down list:
A fragment of the Home Assistant interface showing the entity icon selection window with the MDI icon list displayed. .
The icon has been selected:
Entity settings window Apparent Power in Home Assistant with the mdi:camera icon selected. .
Click update:
Entity settings editing window in Home Assistant with the UPDATE button highlighted in the bottom right corner. .
From now on the icon is changed:
Screenshot of the Home Assistant panel showing the Sensors section, with the Apparent Power sensor using a camera icon and status Unknown. .

For easier browsing of the icons, I recommend visiting the icon library:
https://pictogrammers.com/library/mdi/
The search engine there is much more readable than what HA offers:
Material Design Icons search results for heart, showing various heart-related icon variants. .

It remains to consider what this looks like from the programming side. Suppose we create a sensor via Home Assistant Discovery.
We publish the data under the topic:

homeassistant/sensor/MyDevice/my_voltage/config
.
of content:
Code: JSON
Log in, to see the code
.
Home Assistant then takes the default icon for the voltage:
Voltage history graph from the Test Voltage sensor in Home Assistant. .
Conversely, if we add our own setting to the JSON:
Code: JSON
Log in, to see the code
.
Then we get:
Voltage chart of MyDevice in Home Assistant interface with a heart icon next to the name. .
In this way, the icon can be changed from not the Home Assistant itself, but from the source device performing HASS Discovery.

In summary, personalising icons in Home Assistant is a simple but effective way to better tailor the interface to your needs and preferences. Using MDI's rich set of icons, it is easy to change the appearance of device representations both from within Home Assistant itself and directly in the configuration of devices sending data through Home Assistant Discovery.
Do you also use the wide range of icons in Home Assistant, and if so, for what? .

About Author
p.kaczmarek2
p.kaczmarek2 wrote 11780 posts with rating 9909 , helped 563 times. Been with us since 2014 year.

Comments

Add a comment