How to Override an Icon's Default Color?

Configuration Frontend
4

There are some CSS vars for colors.
Some vars are already defined with some default values (“default theme”).
You may define your own custom theme with some vars to override these particular vars (others will keep using their default values).

Also, you may override these vars for PARTICULAR cards:
– either by defining some custom theme for this card;
– or by card-mod - for particular card or particular entity:

type: entities
entities:
  - entity: fan.kitchen #use default colors
  - entity: fan.bathroom #use custom colors
    card_mod:
      style: |
        :host {
          --var_1: ...;
          --var_2: ...;
          --var_3: ...;
        }

But in more-info these colors again will be “not-overridden”.

1 Like