[solved] Change icon, use 2 different (based on state) with custom:config-template-card?

Configuration
1

I have found that you can use 2 different icons for a switch.
This is what I have in customize.yaml:

switch.kitchen_light:
  icon: mdi:curtains
#  friendly_name: TestCurt
#  device_class: curtain

With device_class: curtain or window, no changes.
By defining the icon, I get that icon which changes color.

How can I have 2 different icons?

Tnx

ps: this is just a test, so disregard that it’s a light

EDIT: my working example is in [solved] Change icon, use 2 different (based on state) with custom:config-template-card? - #8 by Nick4

2

following because I want to do this to my curtains. I can change color and animate based on state but I was gonna have to look into how to do a different icon based on state

3

These are the only device classes available for switches:

https://www.home-assistant.io/integrations/switch/#device-class

Which integration did you use to include the switch in home assistant?

It might support an icon template.

1 Like
4

Hi Tom, thanks for stepping in.

That was the info I did not find, I was looking at the cards and tbh I didn’t know that switches/lights/… are integrations. Learned something new! :+1:

It’s a KNX switch.

5

The KNX integration does not support an icon template.

Your only option would be to change the icon based on state in Lovelace using this:

1 Like
6

So it’s clear that customizing the device class does not work with this integration.

When searching for this, I also bumped on topics where the icon is changed with a template and is that what you mean by

Are these 2 methods the same/somehow linked to each other?

7

Yes it does. There just aren’t many device classes for switches. There are plenty for sensors and binary sensors.

No. Device class is defined in the backend, Lovelace templates are defined in the frontend.

1 Like
8

Ok, thanks for explaining!

I have a working example:

type: custom:config-template-card
entities:
  - switch.kitchen_light
card:
  type: button
  tap_action:
    action: none
  hold_action:
    action: toggle
  name: Kitchen
  entity: switch.kitchen_light
  icon: >-
    ${ states['switch.kitchen_light'].state  === 'on' ? 'mdi:curtains' :
    'mdi:curtains-closed' }
9

Hello Nick,
I grouped three window-sensors to an entity called fenster_buro. I grouped them so I can display the group status. One or more windows open: on. All windows closed: off.

I would love to display this status with an icon. But your modification does not seem to apply. Is my code wrong?

entity_3:
            entity_id: binary_sensor.fenster_buro
            icon: >-
              ${ states['binary_sensor.fenster_buro'].state  === 'on' ? 'mdi:window-open' :
              'mdi:window-closed' }
            templates:
              - blue_on
10

I am trying to achieve something similar. My template works in developer tools but for some reason when applied to something in the config it does not work!

Any ideas?

elements:
  - type: state-icon
    icon: ->
     {{ 'mdi:window-open-variant' if states.binary_sensor.windows_open.state  == 'on' else 'mdi:window-closed-variant' }}
    entity: binary_sensor.windows_open