Use icons from fontawesome in home-assistant
Clone or download
Type Name Latest commit message Commit time
Failed to load latest commit information.
LICENSE.txt Add license and generator script Nov 14, 2018 Initial commit Nov 14, 2018 Fix icon scaling Nov 20, 2018
hass-fontawesome-brands.html Update to fontawesome 5.6.3 Dec 23, 2018
hass-fontawesome-regular.html Update to fontawesome 5.6.3 Dec 23, 2018
hass-fontawesome-solid.html Update to fontawesome 5.6.3 Dec 23, 2018


Use free icons from the fontawesome set in Home-assistant.


The icons are divided into three sets.

  • Solid
  • Regular
  • Brands

Copy the html files for the sets you want into <config>/www/ where <config> is your home-assistant config directory (the directory where your configuration.yaml resides).

Add the folowing to the frontend section of your configuration.yaml

    - /local/hass-fontawesome-solid.html
    - /local/hass-fontawesome-regular.html
    - /local/hass-fontawesome-brands.html

Only add the files you want. They are rather large, and adds to the download size and loading time of your frontend.

Restart home-assistant.


Find the icon you want in the gallery.

The three icon sets have different prefixes: fas:, far: and fab: respectively.


  • to get a solid heart, use fas:heart
  • to get a heart outline, use far:heart
  • to get the twitter symbo, use fab:twitter