Button Card Icon Color changes with dashboard toggle, but not when physical device is toggled

Configuration Frontend
1

I have a button card that turns smart plugs on/off on my dashboard, with the icon color changing with the state. However physically toggling the switch does not change the icon color. I’ve searched this forum but can’t see a similar use case.

Expected behavior: when I physically turn the swtich on, the related icon should change to red (when on) or grey (when off).

This was my original code:

type: horizontal-stack
cards:
  - type: custom:button-card
    entity: switch.smart_switch_gen5
    name: Study
    state:
      - value: "off"
        icon: mdi:power-socket-au
        color: grey
      - value: "on"
        icon: mdi:power-socket-au
        color: red

I also tried this:

type: horizontal-stack
cards:
  - type: custom:button-card
    entity: switch.smart_switch_gen5
    icon: mdi:power-socket-au
    name: Study
    styles:
      icon:
        - color: |
            [[[
              if (entity.state == 'on') return 'red';
              if (entity.state == 'off') return 'grey';
              else return 'yellow';
            ]]]

Dashboard
Home Assistant

So to sumarise, works fine when toggling from the dashboard, but no change in color when toggling from the smart switch.

2

Also tried this without success:

  - type: custom:button-card
    entity: switch.smart_switch_gen5_2
    icon: mdi:power-socket-au
    name: Stairs
    styles:
      icon:
        - color: |
            [[[
              if (states['switch.smart_switch_gen5_2'].state=='on') 
              {
              return ('red')
              }
              else
              {
              return  ('grey')
              }
            ]]]
3

Create this card:

type: button
entity: switch.xxx
state_color: true

then check if a color changes when you toggle the physical switch.

4

Thanks Ildar, unfortunately that doesn’t work either. Looking at the Z-Wave JS logs I suspect it has somehting to do with what’s being (or not being) reported.

Logs when toggled from the dashboard:

2024-12-20 06:55:10.224 INFO STORE: [Node 002] Value updated: 37-0-targetValue true => false
2024-12-20 06:55:14.817 INFO STORE: [Node 002] Value updated: 37-0-targetValue false => true

Logs when toggled from the device:

2024-12-19T22:51:28.374Z CNTRLR « [Node 002] Received updated node info
2024-12-20 06:51:28.380 INFO STORE: [Node 002] Node info (NIF) received
2024-12-19T22:51:33.372Z CNTRLR « [Node 002] Received updated node info
2024-12-20 06:51:33.377 INFO STORE: [Node 002] Node info (NIF) received

Seems the payload when toggling manually is missing the required arguements in the requried format. So a Z-Wave integration issue, not dashboard issue.

5

Means - this is not about a particular card, not about Frontend.
The switch entity is not updated dependently on a physical device.

6

We’re in violent agreement :slight_smile:

7

Why, just a simple agreement, I am not arguing with you.

8

Apologies. Aussie humour. I very much agree with you. No argument :slightly_smiling_face:

1 Like