Button-card icon colour

Configuration
,
1

So I want to change the colour of my dashboard button’s icon based on an attribute value, the source of my TV. The icon should be highlighted when the tv is set to the source that belongs to this button. My card:

type: custom:button-card
entity: media_player.lg_robbert
icon: mdi:sony-playstation
name: PS5
show_name: true
color: |
  [[[
    if(entity.attributes.source == "HDMI 2"){
      return 'rgb(33, 235, 144)';
    } else{
      return 'rgb(68, 115, 158)';
    }
  ]]]
tap_action:
  action: call-service
  service: media_player.select_source
  service_data:
    source: HDMI 2
    entity_id: media_player.lg_robbert

But, the icon colour remains black… what am I doing wrong?

2

I think you need

styles:
  icon:
    - color: |
      [[[
        if(entity.attributes.source == "HDMI 2"){
          return 'rgb(33, 235, 144)';
        } else{
          return 'rgb(68, 115, 158)';
        }
      ]]]
1 Like
3

This throws what looks to be a syntax error although I don’t see it:
image

4

Yes. I think it should be entity.attributes[‘source’]

5

I think there was just an indentation issue, it’s working now! Thanks a lot

6

np. I was asking just these kinds of questions only half a year ago. It’s the only way to learn at this level. I enjoy coding a lot (especially since I’m doing it as a hobby now) but example code is still the thing that usually gets me from “Gee, it would be nice if I could” to “There it is.”

1 Like