X[DEPRECATED] Changing the Home Assistant favicon - thomasloven/hass-config GitHub Wiki

Update:

I made an integration for this: hass-favicon It's much better than the methods described below.

---

I keep a tab with my Home Assistant interface open in my browser at all times.

I also often keep a tab open with my dev server open.

And a few tabs for different pages of the Home Assistant docs.

And at least one topic from the Home Assistant forums.

That's a lot of little blue houses to keep track of...

So I decided enough is enough, and switched out the favicon of my Dev and "Production" setups

Here's how.

---

1: Get the original favicons images here (Apache 2.0). Take all the ones called favicon-something and favicon.ico.

2: Recolor them using e.g. this tool. Make sure the recolored files have the same filenames as the old ones (except favicon.ico which can be saved as a png file for now).

3: Since you can't get ico-files from the service above, what was previously favicon.ico will need to be turned back into an icon file using e.g. this tool

4: Replace your old icons. This is a bit of a different approach depending on how you installed Home Assistant.

Using an nginx proxy or similar

This is the method that's most likely to survive through a Home Assistant update.

If you use nginx or apache or something to connect your home-assistant instance to the world and/or add SSL encryption, you can just intercept all trafic going to http(s)://your.ha.address/static/icons by placing the icons in <your ha config directory>/www/icons/ and adding a routing rule to your config. For nginx, that would look something like:

  location /static/icons/ {
    proxy_pass http://your_local_ha_ip:8123/local/icons/;
    ... # according to your needs e.g. proxy headers, redirects from http to https and such
  }

Python virtual environment

Place the icons in <your venv directory>/lib/python3.7/site-packages/hass_frontend/icons/ (adjust python version if necessary).

Docker install

You can probably mount a directory containing your icons with -v "icons_directory/:/usr/local/lib/python3.7/site-packages/hass_frontend/icons/". I haven't tested it...

Hassio

You're on your own, but Frenck will probably make a plugin for it any second now...

Using my dev setup

Replace the icon files in ./home-assistant-polymer/hass_frontend/icons/. They are unlikely to ever cause a merge conflict if you just leave them. Don't try to check them in to a PR, though, or people will blame me.

After replacing the icons, a cache reset and/or a few ctrl+f5 should give you the new icons.