[SOLVED] Icon color on themes (open window)

Configuration Frontend
10

:+1: thx, this is what i was looking for, for all my Temps- Andi differently agree below 18 should be blue, thou i have green at 21 and red 23
edit: red-23 it’s for inside temps … upps, i mend above 21 and above 23

11

Yeah you can change the levels to whatever you wish, it was more about the method.

12

yes i know, but im not that good att scripting, so i’ve been “testing” alot past weeks … you don’t happend to know how to change the color on Tile, in tracker domain ? … tried with home/not home but not sure, have to look into it again based on the syntax in above

13 
        card_mod:
          style: |
            .tile {
              {% if is_state(config.entity, 'home') %}
                --tile-color: var(--rgb-red-color);
              {% elif is_state(config.entity, 'not_home') %}
                --tile-color: var(--rgb-blue-color);
              {% else %}  
                --tile-color: var(--rgb-purple-color);
              {% endif %}  
            }
1 Like
14

thx alot, seems like i have to rewrite my whole “modded” noctis-green theme , or my my entire own … noctis-green is “not on track” with the latest updates … or maybe it was just my own “added/modded” values there :slight_smile:

16

Hi Friends. I used this mod and all was ok but with the january home assistant update It stopped to works; now the icon are black. Any idea?

17

I found a solution: the issue Is this string:

–tile-color: var(–rgb-red-color);

Now it works in this way:

–tile-color: red;

Have a good day.

Paolo

18

Just so you know, --tile-color: red; uses CSS red which is different than the Home Assistant red color.
If you want to use the same color as the old --rgb-red-color, you should use --tile-color: var(--red-color);

19

Hi guys,

thanks for all your responses.
I use now the tile approach for e.g. Temperatures / doors / presence like suggested by @tom_l with the modification of @ModMonster

type: tile
        entity: sensor.motion_sensor_air_temperature_2
        name: Flur DG
        tap_action:
          action: more-info
        icon_tap_action:
          action: navigate
          navigation_path: /lovelace-warny/dg
        card_mod:
          style: |
            .tile {
              {% if states(config.entity)|float(0) > 24.9 %}
                --tile-color: red;
              {% elif states(config.entity)|float(0) > 22.9 %}
                --tile-color: orange;
              {% elif states(config.entity)|float(0) > 18.9 %}  
                --tile-color: green;
              {% else %}  
                --tile-color: blue;
              {% endif %}  
            }
1 Like
20

Friends since december update this mod stopped to work: i’m not more able to change the tile color.
any idea?
can anyone try please?
thank you very much

21

https://community.home-assistant.io/t/how-to-help-us-help-you-or-how-to-ask-a-good-question/114371#onesix-should-i-tag-people-22

22

New way to get It working with december 23 home assistant version:

card_mod:
  style: |
    ha-card {
      --tile-color: green !important;
    }

Ciao belli

1 Like
23

I am also after a solution for this? does anyone know how to get this to work with the current HA version?

I have an entity sensor.lumi_lumi_weather_master_temperature_3 and I want this to be red above 26C, Green above 21c (but below 26C) and then blue below 21c. how would I do this?

thanks

24

I just changed from this

card_mod:
   style: |
      .tile {

to this:

card_mod:
   style: |
      .icon {
1 Like
25

yes, that does work, too - BUT i just did a test with the ha-card { } css provided above, and it seems that this will also change the cards background color accordingly… so it is the better option :slight_smile:

26

Thanks

I cant seem to get mine to change colour, have I got something wrong

type: tile
entity: sensor.lumi_lumi_weather_master_temperature_3
card_mod:
style: |
.icon {
{% if states(config.entity)|float(0) > 24.9 %}
–icon-color: red;
{% elif states(config.entity)|float(0) > 22.9 %}
–icon-color: orange;
{% elif states(config.entity)|float(0) > 18.9 %}
–icon-color: green;
{% else %}
–icon-color: blue;
{% endif %}
}

27

I my case this works - please note the --tile-color instead of --icon-color

card_mod:
    style: |
      .icon {
        {% if states(config.entity)|float(0) > 64.9 %}
          --tile-color: red;
        {% elif states(config.entity)|float(0) > 61.9 %}
          --tile-color: orange;
        {% elif states(config.entity)|float(0) > 39.9 %}  
          --tile-color: green;
        {% else %}  
          --tile-color: darkblue;
        {% endif %}  
            }

Which one? I am not quite sure which you mean.

28

sorry… the option with ha-card is the better option, because it does also affect the tile card color on mouse over…

29

:slight_smile: Thank you.
That makes sense and works nicely.

30

Consider using mushroom template card, much easier to set up and has all the features you need.

1 Like