Add support for icon_color

[andreas-bulling]

It currently doesn't seem to be possible to customize the icon color(s) similar to other entity cards, e.g. depending on the state of a sensor:

icon_color: >- {{ is_state('binary_sensor.garage_1_reed', 'off') | iif('green', 'red') }}

[ildar170975]

similar to other entity cards,

Like which cards particularly?

customize the icon color(s)

card-mod.

[andreas-bulling]

For example "mushroom-template-card" directly supports changing icon_color.

Do you happen to have an example for how to do the above with card-mod? I've tried for half an hour but without success :(

[ildar170975]

"mushroom-template-card" directly supports changing icon_color.

Unfortunately, this is the only example.
As for standard cards - only a Tile card supports icon_color (but it is not an "entity-row" card).

how to do the above with card-mod

Suggest to ask all card-mod related questions in the dedicated card-mod Community thread.
You may find examples which could be useful:
1st post of the thread -> link at the bottom -> styles for m-e-r.

[danielbrunt57]

I've just finished successfully using card_mod to change the icon for the primary entity in multiple-entity-row without having the secondary entities icon(s) change as well.
Here's my code for changing the icon.
Note: I'm using the decluttering card & templates hence the [[blind]] reference:

        - type: entities
          entities:
            - entity: cover.[[blind]]
              type: custom:multiple-entity-row
              name: ' '
              show_state: false
              card_mod:
                style:
                  hui-generic-entity-row:
                    $: |
                      state-badge {
                        --card-mod-icon: {{ iif(states('cover.[[blind]]') == "open", "phu:blind-tilt-open", "phu:blind-tilt-closed") }}
                        }
              entities:
                - entity: sensor.[[blind]]_battery_level
                  name: Battery
                - entity: sensor.[[blind]]_battery_level
                  name: false
                  icon: true
          show_header_toggle: false
          state_color: false
          card_mod:
            class: inline-card

Before I achieved that, I was trying:

              card_mod:
                style:
                  :host {
                    --card-mod-icon: {{ iif(states('cover.[[blind]]') == "open", "phu:blind-tilt-open", "phu:blind-tilt-closed") }}
                  }

but that was changing the icon for all entities in the row.

@andreas-bulling
You should be able to acheive an icon color change with:

              card_mod:
                style:
                  :host {
                    color: {{ iif(states('binary_sensor.garage_1_reed') == "off", "green", "red") }}
                  }

My version of the code works for the color of the primary entity icon.

              card_mod:
                style:
                  hui-generic-entity-row:
                    $: |
                      state-badge {
                        --card-mod-icon: {{ iif(states('cover.[[blind]]') == "open", "phu:blind-tilt-open", "phu:blind-tilt-closed") }};
                        color: {{ iif(states('cover.[[blind]]') == "open", "green", "red") }}
                      }

And after opening Blind 1:

[andreas-bulling]

Thanks a lot for the detailed answer and suggestion. Unfortunately it still doesn't work for some reason. I tried a basic example on a different card and this worked. So card-mod is working in principle. But for some reason I can't modify the multiple-entity-row

[danielbrunt57]

I've since modified my card_mod: style: to

card_mod:
  style:
    hui-generic-entity-row$state-badge:
      $: |
        ha-state-icon {
          {% if is_state(config.entity, 'open') %}
            --card-mod-icon-color: gold;
            --card-mod-icon: phu:blind-tilt-open;
          {% elif is_state(config.entity, 'closed') %}
            --card-mod-icon-color: beige;
            --card-mod-icon: phu:blind-tilt-closed
          {% else %}
            --card-mod-icon-color: red;
            --card-mod-icon: mdi:help-circle
          {% endif %}
        }

Can you post your problem code for the multiple-entity-row so I can check?

[ildar170975]

There is a dedicated card mod community thread.
All mods for multiple-entity-row you are looking for were posted there 3 years ago.
Go to 1 st - link at the bottom - styles for m-e-r.
And suggest to continue discussing there.

[ildar170975]

Daniel, glad that you sorted out your issue in the config-template-card repo, but your examples with colored main icon are rather specific and may not be applied for all cases. In fact , your example is not optimal.