Change label color based on state?

In Lovelace is it possible to show a temperature in a different color, based on the value (state). E.g.

  - entity: sensor.synology_temperature_sda
    attribute_templates:
      state:
        - label:
          styles:
            - color: >-
              {% if states("sensor.synology_temperature_sda") > '40' %}
              red
              {% else %}
              green
              {% endif %}

above does not work, so I’m looking for the correct way to do this.
Thanks.

Would be interesting for me to. Same problem, color as visual warnings on a temperature (or any other sensor value)

Here you go.

@M1ke thanks, but I still don’t get the syntax right
Can you give a small example based on my first post?

@Djiest My previous answer was not very helpful - and wrong! :sweat_smile:
You need card-mod and not custom-ui, sorry for that.

Is this how you imagined?

type: entities
entities:
  - entity: sensor.synology_temperature_sda
    style: |
      :host {
        color:
          {% if states('sensor.synology_temperature_sda')| float >= 40 %}
            red
          {% else %}
            green
          {% endif %}
      }
2 Likes

Yes, got it working, thanks!
image

1 Like

Hi everyone,
i am trying to do the same in a picture elements card, precisely in the state label.

  - type: state-label
    entity: sensor.consumo_casa_power
    style:
      color: |-
        {% if states('sensor.consumo_casa_power')| float > 0 %}
          red 
        {% else %} 
          green
        {% endif %}
      font-size: 1.8vw
      font-weight: 100
      top: 23%
      left: 89%
      width: 0,5%

but it doesn’t work.
Someone knows how i can solve this issue?
Thanks!!!

2 Likes

I have the same problem with the picture elements card.
Card Mod works for the font color, but then TOP and LEFT doesn’t work anymore!!!

1 Like

Hello macnug,
I have the same problem. Did you manage to solve uit?