8000 GitHub - thomasloven/hass-custom_icons: 🔹 Use custom svg icons in Home Assistant
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

thomasloven/hass-custom_icons

Repository files navigation

example image

Installation

  • Install Custom Icons through HACS Open your Home Assistant instance and open a repository inside the Home Assistant Community Store.
  • This is not on HACS yet, but you can add it as a Custom Repository. Make sure to select "Type: Integration".
    • Or copy the contents of custom_components/custom_icons/ to <config>/custom_components/custom_icons
  • Restart Home Assistant
  • Click this Open your Home Assistant instance and start setting up a new integration.
    • Alternatively, go to your integrations configuration, click "Add Integration" and find "Custom Icons"

Usage

  • Go to your integrations configuration, click "Custom Icons" and then "CONFIGURE".

configuration

  • Here, in the Configuration Panel, you can pick which icon sets you want to use.

select sets

  • After enabling icon sets and refreshing your browser (F5) you will be able to find your icons in the icon picker.

icon picker

Icon sets

Your own icons

To use your own icons, place their .svg files in <config>/custom_icons (the directory should have been created by Custom Icons automatically). You can also place icons in subdirectories.

If you add new icons, you need to push the RELOAD button before they can be used.

Note about safety:

SVG files may contain SVG and Javascript and shall be considered unsafe. Home Assistant normally protects you from harmful code in SVG icons, but in order to make e.g. full color or animated icons work this protection has been removed by Custom Icons.

Only use icons you trust (and preferably have inspected the code for). The author of Custom Icons takes no responsibility for the contents of any icon set - not even those included in Iconify.

Iconify

Iconify is a framework for several popular icon sets.

The icon sets are update frequently, so you can manually download the lates updates from the Custom Icons configuration panel.

You also need to download them by clicking the button manually the first time.

Fontawesome Pro icons

If you bought the fontawesome package, you should have received the icon set as a zip file or something.

Somewhere in this file, there's a folder named metadata which contains a file icons.json.

Copy and rename this file to <config>/custom_icons/fontawesome.json.

Push the RELOAD button in the Custom Icons configuration panel.

Webfonts

There is some support for svg webfonts like RPG Awesome.

To use those, get the <whatever>-webfont.svg file and copy that to <config>/custom_icons/.

Push the RELOAD button in the Custom Icons configuration panel.

Note that SVG webfonts has been deprecated and removed from the SVG standard. Things may or may not work.

FAQ

Does this replace hass-fontawesome?

Yes

Do I need all that #fullcolor nonsense from hass-fontawesome?

No

About

🔹 Use custom svg icons in Home Assistant

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published
0