Icon color for custom-button

Configuration Frontend
1

Hello all!

I am still fairly new to HA and learning its ins and outs so please be gentle since Im still learning a lot. Ive setup a custom-button based on my garage door opener relay and the tilt sensor which are two different entities. Essentially the garage door switch is always in the off position and just toggles on for a moment when pressed to open or close the door so I am using the tilt sensor entity on the door to change the icon and display the state. I am also wanting to change the color of the icon based on this same state but for some reason the color will not change using the same javascript as the other fields and I am not really sure why. If anyone can lead me in the right direction I would be greatly appreciated!

type: custom:button-card
show_entity_picture: true
state:
  - value: 'off'
    icon: |
      [[[
        if (states['binary_sensor.left_garage_door_window_door_is_open'].state === "off")
          return "mdi:garage-lock";
        else if (states['binary_sensor.left_garage_door_window_door_is_open'].state === "on")
          return "mdi:garage-open";
      ]]]
    color: |
      [[[
        if (states['binary_sensor.left_garage_door_window_door_is_open'].state === "off")
          return "green";
        else if (states['binary_sensor.left_garage_door_window_door_is_open'].state === "on")
          return "red";
      ]]]
tap_action:
  action: toggle
entity: switch.garage_door_opener_2
show_state: false
show_label: true
size: 20%
name: Left Garage Door
label: |
  [[[
    if (states['binary_sensor.left_garage_door_window_door_is_open'].state === "off")
      return "Closed";
    else if (states['binary_sensor.left_garage_door_window_door_is_open'].state === "on")
      return "Open";
  ]]]
2

Hi Ryan, Welcome.
I don’t use the custom:button-card, but know from experience you have a bigger change to get a useful answer when dropping your question in the/a ‘custom:button-card-topic’, for example: Fun with custom:button-card

You might even find your answer there without dropping the question. Tons of info is already available.

3

Ill give it a go! Thanks! Didnt realize there was a section just for that card.