Custom brand icons for Home Assistant
- Custom brand icons
- Icons Available
- Alexa
- Apple
- Aqara
- Battery Status
- Blink Cameras
- Car Manufacturers
- Christmas Decorations
- Doors
- Duco Ventilation
- Dyson
- Elgato
- Fritz
- Garbage Collection
- HA Addons
- House Rooms
- IKEA
- LG
- Meross
- Miscellany of Icons
- Modem/Router ISP
- Moes
- Netgear
- Networking
- Philips Hue
- Philips Hue made by @rchiileea
- Reolink
- Ring
- Schneider Electric
- Shutter Percentage of Opening
- Sonoff
- Sonos
- Stage DMX Lights
- Tesla
- Television
- TP-Link
- Ubiquiti
- Umage Lamps
- Pedastal
- Window and Roller Shutter
- Vacuum Parts
- Delivery Services
- Bose
- Huawei
- Icons Available
- Install
- Help me insert more icons!
- Don't see the icon?
- Make icon
- Icon Requests?
- Customize the prefix
- Pulls requests
- Thanks
- Support the project
Icon | Name | Icon | Name |
---|---|---|---|
echo-dot-4-group | echo-dot-gen-3 | ||
echo-dot-gen-4-clock | echo-dot-gen-4 | ||
echo-gen-2 | echo-plus | ||
echo-show-5-gen-2 | echo-show-5-group | ||
echo-show-8-gen-2 | echo-show-8-group | ||
echo-spot |
Icon | Name | Icon | Name |
---|---|---|---|
apple-airpods-pro | apple-airpods | ||
apple-ipad-pro | apple-iphone | ||
apple-tv-box | apple-tv | ||
apple-watch-alt | apple-watch | ||
apple-tv-gen2-remote | homekit | ||
homepod | homepod-mini | ||
imac |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
battery-charged | battery-critical | ||
battery-full | battery-good | ||
battery-half | battery-low |
Icon | Name | Icon | Name |
---|---|---|---|
mini-camera | sync-module | ||
xt2-camera |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
christmas-lights | christmas-tree-v2 | ||
christmas-tree | christmas-wreath |
Icons made by @rchiileea
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
duco-auto | duco-logo | ||
duco-1 | duco-2 | ||
duco-3 |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
dyson-desk | dyson-floor |
Icon | Name | Icon | Name |
---|---|---|---|
elgato-key-light-air | elgato-key-light | ||
elgato-ring-light |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
fritz-repeater | fritzbox-7530 |
Icons made by @sandrybridge
Icon | Name | Icon | Name |
---|---|---|---|
garbage-plastic | garbage-organic | ||
garbage-residual | garbage-glass-alu | ||
garbage-cardboard |
Icon | Name | Icon | Name |
---|---|---|---|
google-home | google-wifi-router | ||
home-max | home-mini | ||
nest-wifi-repeater | nest-wifi-router | ||
pixelwatch | nest-mini | ||
chromecast | google-pixel | ||
chromecast-alt | nest-hub |
Icons made by @sandrybridge
Icon | Name | Icon | Name |
---|---|---|---|
cloudflare | mosquitto | ||
nginx | duckdns | ||
nut | adguard | ||
samba | esphome | ||
nodered | vaultwarden | ||
letsencrypt |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
bathroom | bedroom | ||
driveway | garage-alt-open | ||
garage-alt-shut | garden | ||
kids-room | kitchen | ||
living-room | office | ||
outside | cloakroom |
Icons made by @rchiileea and @Gtt1229
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
lg-air-purifier | lg-aircon | ||
lg-cooker | lg-fridge | ||
lg-oled55 | lg-signiture |
Icon | Name | Icon | Name |
---|---|---|---|
fastgate | nexxt |
Icon | Name | Icon | Name |
---|---|---|---|
moes-switch-dual | moes-switch-single | ||
moes-switch-triple |
Icons made by @sandrybridge
Icon | Name | Icon | Name |
---|---|---|---|
pfsense-logo | openwrt-logo |
These are the official icons from the philips developer channel
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
reolink-510 | reolink-811 | ||
reolink-820 | reolink-842 | ||
reolink-argus | reolink-e1 | ||
reolink-go |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
ring-alarm-panel | ring-alarm | ||
ring-doorbell-pro | ring-doorbell | ||
ring-floodlight | ring-smart-lighting | ||
ring-spotlight-cam | ring-stick-up-cam |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
apc-ups-basic | apc-ups-upright | ||
wiser-heating-ctl-off | wiser-heating-ctl-on | ||
wiser-thermostat-off | wiser-thermostat-on |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
shutter-0 | shutter-10 | ||
shutter-20 | shutter-30 | ||
shutter-40 | shutter-50 | ||
shutter-60 | shutter-70 | ||
shutter-80 | shutter-90 | ||
shutter-100 |
Icon | Name | Icon | Name |
---|---|---|---|
bridge | mini | ||
smart-camera | smart-plug-sonoff | ||
usb-smart-adaptor | window-sensor |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
sonos-arc | sonos-beam | ||
sonos-bookshelf-horizontal | sonos-bookshelf-vertical | ||
sonos-move | sonos-one | ||
sonos-playbar | sonos-sub | ||
sonos-play-3 | sonos-port |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
stage-backlight | stage-light-group | ||
stage-light | stage-spot-light | ||
stage-uplight | stagel-light-2-group | ||
stagel-light-2 |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
model-s-charge-side | model-s-charge | ||
model-s-side | model-s | ||
model-x-charge | model-x-open | ||
tesla-icon |
Icons made by @pinky007 @rchiileea @simpleicons
Icons made by @rchiileea
Icon | Name |
---|---|
tp-link-tapo |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
ubiquiti-ap | ubiquiti-logo | ||
ubiquiti-usg-p3 | ubiquiti | ||
unifi | unifi-protect |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
umage | umage-carmina | ||
umage-acorn |
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
pedastal-fan | pedastal-fan-hollow | ||
fan-blade |
Icons made by @rchiileea
Icons made by @rchiileea
Icon | Name | Icon | Name |
---|---|---|---|
vac_filter | vac_mbrush | ||
vac_mop | vac_sbrush |
Icon | Name | Icon | Name |
---|---|---|---|
royalmail | fedex | ||
dhl | usps | ||
ups-dlv |
Icon | Name | Icon | Name |
---|---|---|---|
bose-soundtouch | boses-oundwave |
Icon | Name | Icon | Name |
---|---|---|---|
huawei-solar-battery-5 | huawei-solar-battery-10 | ||
huawei-solar-inverter |
We recommend installing Custom brand icons card via Home Assistant Community Store
-
Add the folowing to the
frontend
section of yourconfiguration.yaml
frontend: extra_module_url: - /local/community/custom-brand-icons/custom-brand-icons.js
-
(optional) Or add the following to your lovelace configuration using the Raw Config editor under Configure UI or ui-lovelace.yaml if using YAML mode.
resources:
- type: js
url: /local/community/custom-brand-icons/custom-brand-icons.js
To add custom repositories please follow this guide. Set URL to `` and category to Lovelace
.
-
Download
custom-brand-icons.js
file from the latest release. -
Copy the
custom-brand-icons.js
file into<config>/www/
the directory where yourconfiguration.yaml
resides. -
Add the folowing to the
frontend
section of yourconfiguration.yaml
frontend:
extra_module_url:
- /local/custom-brand-icons.js
Or add the following to your lovelace configuration using the Raw Config editor under Configure UI or ui-lovelace.yaml if using YAML mode.
resources:
- type: js
url: /local/custom-brand-icons.js
Restart home-assistant.
you can use icons by entering the prefix phu:
Example of integration in the card
entities:
- entity: light.lampada_entrance
icon: 'phu:go'
name: Go
- entity: light.monitor_2_right
icon: 'phu:play'
name: play 1
- entity: light.monitor_2_left
icon: 'phu:play'
name: play 2
show_header_toggle: false
title: Custom brand icons
type: entities
Attention I remind you that the icons must be in svg format
If you want, you can help me expand the number of icons available. Just add the following string to the var icons
variable of the custom-brand-icons.js
file
let's take the first string for example:
"Bollard": [0, 0, 24.0, 24.0, "string"]
Bollard
= icon name0, 0, 24.0, 24.0
= this data can be recovered from the svg fileviewBox="0 0 24 24"
If this data is not present in the file you can leave the one indicated by meString
= this data can be recovered from the svg file<path d="M21,12.5 C21,13.33 18.76,...."
In particular you will have to enter only the part of the vector code"M21,12.5 C21,13.33 18.76"
For an example take a look at the icons already inserted- When you open a pull request do it on the dev branch
- In addition to inserting the icon in the
icon-svg
folder and updating thecustom-brand-icons.js
file, remember to also update theREADME.md
file by inserting the new icon
It probably depends on the cache. Open Home assistant from an incognito window and check that the icon loads if yes then it depends on the cache, otherwise double check the installation
To make an icon in svg format you can use different programs starting from illustrator or inkview. The size of the icons must be 24x24 and the svg code must not contain transform, translate, scale but only viewbox
The icon is not there? open a custom icon request The icons to integrate must be in svg format
In case you want to create your own perfix you can edit the last line of the custom-brand-icons.js
window.customIconsets["yourprefix"] = getIcon;
If you want to integrate icons or change errors in the documentation do not hesitate to open a pull request remember to open it on the dev branch
Thanks, as always, to the precious contribution to @rchiileea for the creation of the required icons!
Do you like these icons? Support the project with a pizza ππ