Entity Button change colour based on state

Configuration
1

I have the following button set up to toggle my gates open/closed:

entity: cover.main_gate
hold_action:
  action: more-info
icon: 'mdi:gate'
icon_height: 40px
show_icon: true
show_name: true
tap_action:
  action: toggle
type: entity-button

Looks like this:
image

Is it possible either change the icon (to an open gate icon) or change the background colour to red of the button when the gate is open in order to quickly determine its state? If yes then what can I use?

2

This is only possible with custom cards.
button-card or if you want to stay with the core entity-button, card-mod

2 Likes
3

Have you looked at the device_class? it would change the icon at least…

for color, you could also use custom_ui, which is still supported.

not sure if it has been added yet, but any time soon an open gate will be available in the mdi icons hasn’t been decided on yet…

4

Yes the button card enabled me to do just that, thanks

5

if you use a custom binary sensor the icon change color.
the binary sensor have two possible values: On / Off

Sample config card.

entity: binary_sensor.vlc_play_random
icon: 'mdi:shuffle-variant'
icon_height: 40px
show_icon: true
show_name: false
tap_action:
  action: call-service
  service: script.radio_vlcrandom
type: button
show_state: false
2 Likes
6

Can you show how you managed to keep the icon on the screen. When i press the button it just toggles the colour state. Pretty new to this so not really sure what i’m doing.