thoompje
(Thoompje)
January 30, 2022, 8:59am
1
Hi All,
I have a question about the icon color when it has a specific state. When my heating system is heating then the color of the icon is orange, but when the status is idle it is Grey. What I want is that the icon state always is orange when the system is idle of heating. But when the system is off then I need Grey !
Hopefully you guys can help me, in the screenshot you see what I mean.
Thanks a lot
tom_l
January 30, 2022, 9:10am
2
These colours are set by the following theme variables:
### Climate devices ###
state-climate-heat-color: "#FF6262" # red
state-climate-cool-color: "#039BE5" # blue
state-climate-fan_only-color: "#0da035" # green
state-climate-dry-color: "#e0b400" # yellow
state-climate-auto-color: "ff8100" # orange
See: https://www.home-assistant.io/integrations/frontend/#defining-themes
1 Like
thoompje
(Thoompje)
January 30, 2022, 2:51pm
3
It is the paper-item-icon-color: rgb(255, 129, 0) #ff8100 what does the trick, but in glance this is not the solution. All my icons appear orange now…
Think about using card-mod. Go to the corresponding thread, there are examples for Glance card.
thoompje
(Thoompje)
January 30, 2022, 4:25pm
5
I used custom button-card, thats the best way to achief this. Here is my config
type: custom:button-card
entity: climate.woonkamer
icon: mdi:thermostat
color_type: icon
size: 18%
name: woonkamer
action: more_info
label: |
[[[
var bri = states[‘climate.woonkamer’].attributes.temperature;
return ’ ’ + (bri ? bri : ‘0’) + ’ °C’;
]]]
show_label: true
show_state: true
styles:
label:
- font-size: 15px
- padding: 2%
name:
- font-size: 15px
- padding: 2%
state:
- font-size: 15px
- padding: 3%
state:
value: ‘off’
color: rgba(169, 177, 188, 255)
value: heat
color: rgb(255, 129, 0)
value: idle
color: rgb(255, 129, 0)
1 Like