Custom brand icons

Custom brand icons for Home Assistant

At the moment I have integrated only the main icons of Philips Hue products!

---

Philips Hue

These are the official icons from the philips developer channel

Icon	Name
	bollard
	ceiling-round
	ceiling-square
	ceiling-fair
	ceiling-still
	desk-lamp
	double-spot
	floor-lantern
	floor-shade
	floor-spot
	pendant-long
	pendant-long-up
	pendant-round
	single-spot
	table-shade
	wall-lantern
	wall-shade
	wall-spot
	bulb-candle
	bulb-flood
	bulb-foh
	bulb-general-group
	bulb-group
	bulb-group-filament-candle
	bulb-group-filament-alt
	bulb-group-filament-spot
	bulb-group-filament-sultan
	bulb-group-sultan-lightstrip
	bulbs-classic
	bulbs-filament
	bulb-filament-alt
	bulbs-spot
	bulbs-sultan
	bridges-v1
	bridges-v2
	dimmer-switch
	friends-of-hue
	motion-sensor
	devices-plug
	devices-tap
	bloom
	go
	play
	iris
	light-strip
	recessed-floor
	recessed-ceiling
	rooms-attic
	rooms-balcony
	rooms-bathroom
	rooms-bedroom
	rooms-carport
	rooms-closet
	rooms-computer
	rooms-dining
	rooms-driveway
	rooms-gym
	rooms-hallway
	rooms-kitchen
	rooms-living
	rooms-mancave
	rooms-nursery
	rooms-kids-bedroom
	rooms-office
	rooms-other
	rooms-outdoor-social-time
	rooms-pool
	rooms-porch
	rooms-recreation
	rooms-staircase
	rooms-storage
	rooms-outdoor
	rooms-studio
	rooms-terrace
	rooms-toilet
	amarant
	amaze
	beyond
	beyond-down
	beyond-solid
	beyond-up
	button
	centris
	centris-two
	centris-three
	daylo-wall
	lily-xl
	pedestal
	pillar-nyro
	pillar-tuar
	plug-eu
	plug-uk
	signe
	socket-uk
	socket-eu
	socket-us
	wall-appear
	wall-econic
	wall-econic-lantern
	wall-econic-lantern-base
	wall-econic-lantern-top
	wall-flood
	wall-fuzo
	wall-fuzo-h
	wall-impress
	wall-impress-narrow
	wall-lucca
	wall-nyro
	wall-resonate
	wall-tuar
	wall-turaco
	wellner
	wellner-solid
	wellness
	lightstrip-tv-alt
	lightstrip-tv
	lightstrip-wrap
	pillar-spot
	pillar-spot-double
	adore
	adore-alt
	centura
	centura-round
	bulb-group-lightstrip
	bulb-group-lightstrip-v
	liane
	ceiling-explore
	sync-box-alt
	sync-box
	ceiling-fugato-two
	ceiling-fugato-three
	ceiling-fugato-four
	ceiling-fugato-two-alt
	ceiling-fugato-three-alt
	ceiling-fugato-four-alt

---

Miscellany of icons

Icon	Name
	google-home
	home-max
	home-mini
	roborock
	dome-light
	apple-tv
	smoke-detector
	nas
	spot-bulb-top
	light-string
	ceiling-fan
	ceiling-fan-light
	floor-lamp-dual
	floor-lamp
	ceiling-lamp
	ceiling-lamp-plafond
	ceiling-lamp-round
	chandelier
	ceiling-spot-lamp
	fronius-inverter-gen24

---

Sonoff device

Icon	Name
	mini
	window-sensor
	bridge
	usb-smart-adaptor
	smart-plug-sonoff
	smart-camera

---

Moes device

Icon	Name
	moes-switch-single
	moes-switch-dual
	moes-switch-triple

---

Modem/Router ISP

Icon	Name
	nexxt
	fastgate

---

Meross device

Icon	Name
	smart-plug-schuko
	double-smart-plug
	smart-power-strip
	smart-desk-lamp
	smart-plug-it
	temp-sensor
	triple-wall-switch
	double-wall-switch
	single-wall-switch
	smart-switch
	lamp-bedside-table
	lamp-bedside-table-2
	wall-switch
	essential-oil-diffuser
	roller-shutter-switch

---

Battery status

Icon	Name
	battery-charged
	battery-full
	battery-good
	battery-half
	battery-low
	battery-critical

---

Netgear device

Icon	Name
	arlo-essential-indoor
	arlo-cam
	arlo-pro-3
	arlo-ultra-2
	arlo-q
	arlo-floodlight
	arlo-audio-doorbell
	arlo-video-doorbell
	arlo-security-light
	arlo-base-station
	arlo-baby
	orbi
	wifi-extender
	nighthawk

Install

HACS

We recommend installing Custom brand icons card via Home Assistant Community Store

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

frontend:
extra_module_url:
  - /local/community/custom-brand-icons/custom-brand-icons.js

2. (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

Manual Installation

To add custom repositories please follow this guide. Set URL to https://github.com/elax46/custom-brand-icons and category to Lovelace.

1. Download custom-brand-icons.js file from the latest release.

2. Copy the custom-brand-icons.js file into <config>/www/ the directory where your configuration.yaml resides.

3. Add the folowing to the frontend section of your configuration.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.

Use

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

Icon Requests?

The icon is not there? open a custom icon request

Customize the prefix

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;

Don't see the 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

Help me insert more icons!

Attention I remind you that the icons must be in svg format

If you like, you can help me expand the number of icons available. Just add to the variable var icons

let's take the first string for example:

"Bollard": [0, 0, 32.0, 32.0, "string"]

• Bollard = icon name

• 0, 0, 32.0, 32.0 = this data can be recovered from the svg file transform="scale(0, 0, 32.0, 32.0) If this data is not present in the file you can leave the one indicated by me

• String = this data can be recovered from the svg file <path d="M21,12.5 C21,13.33 18.76,...."

Thanks

thanks to for @mutzl your contribution

Support the project

Do you like these icons? Support the project with a pizza 🍕🍕