Doni49
March 29, 2025, 2:29am
1
I have a button on my dashboard for guest WiFi access.
Pressing the button displays a QR code.
But the icon color is too similar to the background color (my dashboard uses LCARS TNG). Nothing I’ve tried changes the color. In fact my last attempt caused HA to not even show the YAML for the button – there was an error message that styles was an unexpected key. I had to edit the YAML for the vertical stack that it is part of.
My latest attempt is below:
show_name: false
show_icon: true
type: button
tap_action:
action: navigate
navigation_path: "#guestWiFi"
entity: image.ireland_guest
name: "Guest WiFi Access "
icon: mdi:wifi
show_state: false
hold_action:
action: navigate
navigation_path: /hall-tablet/guest-wifi-access
icon_height: 50px
styles:
icon:
- color: yellow
Take a look at custom:button-card
Based on this code, I think you are confusing the two.
styles:
icon:
- color: yellow
You can use card_mod to change the color of the icon as well
show_name: false
show_icon: true
type: button
tap_action:
action: navigate
navigation_path: "#guestWiFi"
entity: image.ireland_guest
name: "Guest WiFi Access "
icon: mdi:wifi
show_state: false
hold_action:
action: navigate
navigation_path: /hall-tablet/guest-wifi-access
icon_height: 50px
card_mod:
style: |
ha-card {
--state-color: yellow !important;
}
1 Like
Doni49
March 29, 2025, 3:11am
3
I see why you went in that direction because it isn’t very clear. I can assure you they are talking about the custom:button card
Another user posted later in the thread
I changed that post’s title to make it very clear.
1 Like
Doni49
March 29, 2025, 3:20am
5
I decided yellow was a bit too bright and went with Moccasin.
I’m please with how it turned out. Thanks for the assistance!
1 Like
If you continue to use custom:button card , this is the main thread with a lot of information and examples
I do the same with my dashboard colors, but for examples I keep it simple and bright.
1 Like
