Possible to use custom icons in Dashboard?

Third party integrations HADashboard
1

Hi,

I am want to use custom images in place of MDI icons. I know you can make a folder for images when making skins but I’m not sure how to define them in the variables.yaml or custom.css

Any points would be appreciated, Thanks.

EDIT: I have found many people asking the same question and see that it is not.

2

I’ve been looking for custom icons and figured out an alternative solution for now using widget_style. Here’s an example of my script widgets to select a radio channel:

radio_channel_vrt_radio1:
  widget_type: script
  entity: script.radio_channel_vrt_radio1
  icon_on: ''
  icon_off: ''
  widget_style: "background-image: url('custom_css/icons/vrt_radio1.svg'); background-size: contain; background-repeat: no-repeat; background-position: center center"

I create the icons as 200x200px svg with a margin of 20px. The result is satisfactory for me.

image
image980×822 66.6 KB

3

Hi, just dropped in to thank you for sharing. I am looking for EXACTLY the same thing.
I mean ‘letterlijk hetzelfde’ lol

1 Like
4

Thanks for sharing! Did you also find a way to have different icons/images for on and off states?

5

It can’t find the pictures that path …and they’re there ("background-image: url(‘custom_css/img/radio-svgrepo-com.svg’))
Képkivágás

6

does it gives an error or just not displaying?
u tried png files too?

mine looks like this:

background-image: url('custom_css/bbicons/VRT_Radio_1_logo.png'); background-size: contain; background-repeat: no-repeat; background-position: center center

7

Succes! Thanks! it was correct: url(’/custom_css/ …’)