Icon colour change depends on value of thermometer or Battery

Configuration Frontend
1

Hi All,
I thought I had this cracked but my icon remains stubbornly white can anyone help?

The goal is to have it blue when below 7c and gradually change colour to red when above 35c

{% set temperature = states('sensor.average_house_temperature') | int %}
{% set r, g, b = 0, 0, 255 %}
{% if (temperature > 35) %}
    {% set r = 255 %}
    {% set g = 0 %}
    {% set b = 0 %}
{% else if (temperature > 30) %}
    {% set r = 255 %}
    {% set g = 128 %}
    {% set b = 0 %}
{% else if (temperature > 20) %}
    {% set r = 255 %}
    {% set g = 255 %}
    {% set b = 0 %}
{% else if (temperature > 7) %}
    {% set r = 0 %}
    {% set g = 255 %}
    {% set b = 0 %}
{% endif %}
{{ "#%0x" | format( r * 0x10000 + g * 0x100 + b * 0x1 ) }}

I have it working for a battery but this is based on a percentage of 100% I have tried to repurposed it here but I feel a little out of my depth and would really appreciate someones help here!

BTW here is my working code for a battery I hope this helps someone :slightly_smiling_face:


{% if states('sensor.solis_s6_solis_battery_charge_power') | float == 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0)  == 0 %} W
{% elif states('sensor.solis_s6_solis_battery_charge_power') | float |round(0)  != 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0)  != 0 %} W
{{states('sensor.solis_s6_solis_battery_charge_power') | float |round(0)  }} W
{{states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0)  }} W
{% elif states('sensor.solis_s6_solis_battery_charge_power') | float |round(0)  != 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0)  == 0 %}
{{states('sensor.solis_s6_solis_battery_charge_power') | float |round(0)  }} W
{% elif states('sensor.solis_s6_solis_battery_charge_power') | float |round(0)  == 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0)  != 0 %} 
{{states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0)  }} W
  {% endif %}
2

main card-mod thread.

3

Yep card-mod is the way to go, here is my code for batteries which only have state of high, middle, low:

    card_mod:
      style: >
        :host {   
         --card-mod-icon: {% if
        is_state('sensor.strych_temperatura_battery_level', 'high') %}
        mdi:battery {% elif is_state('sensor.strych_temperatura_battery_level',
        'middle') %} mdi:battery-50 {% else %} mdi:battery-10 {% endif %}; }
        :host { 
          --card-mod-icon-color: {% if
        is_state('sensor.strych_temperatura_battery_level', 'high') %} #4CAF50
        {% elif is_state('sensor.strych_temperatura_battery_level', 'middle') %}
        orange {% else %} red {% endif %}; }
1 Like
4

Solution depends on a particular card/place.
Someone’s solution may not work on another place.
That is why I suggest not to take someone’s ready code blindly - but go to a proper place & find out a needed proper solution.

5

Yes, for me this isn’t going to work due to other cards / chips in place already, surely this must be doable with the code I have (I must being doing something wrong as it works fine with the battery?)

6

I achieved what I wanted (more or less)

see below

type: vertical-stack
cards:
  - type: custom:mushroom-chips-card
    chips:
      - type: template
        icon_color: indigo
        icon: mdi:thermometer-alert
        content: >-
          Average Temp {{
          (states('sensor.average_house_temperature')|float)|round(1) }}°C
        tap_action:
          action: more-info
        hold_action:
          action: more-info
        double_tap_action:
          action: more-info
        entity: sensor.average_house_temperature
    alignment: center
    visibility:
      - condition: or
        conditions:
          - condition: numeric_state
            entity: sensor.average_house_temperature
            above: -30
            below: 0
  - type: custom:mushroom-chips-card
    chips:
      - type: template
        icon_color: cyan
        icon: mdi:thermometer-minus
        content: >-
          Average Temp {{
          (states('sensor.average_house_temperature')|float)|round(1) }}°C
        tap_action:
          action: more-info
        hold_action:
          action: more-info
        double_tap_action:
          action: more-info
        entity: sensor.average_house_temperature
    alignment: center
    visibility:
      - condition: or
        conditions:
          - condition: numeric_state
            entity: sensor.average_house_temperature
            above: 0
            below: 6
  - type: custom:mushroom-chips-card
    chips:
      - type: template
        icon_color: green
        icon: mdi:thermometer
        content: >-
          Average Temp {{
          (states('sensor.average_house_temperature')|float)|round(1) }}°C
        tap_action:
          action: more-info
        hold_action:
          action: more-info
        double_tap_action:
          action: more-info
        entity: sensor.average_house_temperature
    alignment: center
    visibility:
      - condition: numeric_state
        entity: sensor.average_house_temperature
        above: 6
        below: 15
  - type: custom:mushroom-chips-card
    chips:
      - type: template
        icon_color: orange
        icon: mdi:thermometer-plus
        content: >-
          Average Temp {{
          (states('sensor.average_house_temperature')|float)|round(1) }}°C
        tap_action:
          action: more-info
        hold_action:
          action: more-info
        double_tap_action:
          action: more-info
        entity: sensor.average_house_temperature
    alignment: center
    visibility:
      - condition: or
        conditions:
          - condition: numeric_state
            entity: sensor.average_house_temperature
            above: 15
            below: 22
  - type: custom:mushroom-chips-card
    chips:
      - type: template
        icon_color: red
        icon: mdi:thermometer-alert
        content: >-
          Average Temp {{
          (states('sensor.average_house_temperature')|float)|round(1) }}°C
        tap_action:
          action: more-info
        hold_action:
          action: more-info
        double_tap_action:
          action: more-info
        entity: sensor.average_house_temperature
    alignment: center
    visibility:
      - condition: numeric_state
        entity: sensor.average_house_temperature
        above: 22
        below: 45

hope this helps someone