🔹 Card-mod - Add css styles to any lovelace card

old-style badges FIX:

image

title: ...
path: ...
badges:
  - entity: sensor.xiaomi_cg_1_co2
    type: custom:hui-state-badge-element
    card_mod:
      style: |
        :host {
          color: orange;
          --label-badge-text-color: red;
          --label-badge-red: cyan;
          --label-badge-background-color: yellow;
          --ha-label-badge-label-color: green;
        }

OR - open “card-mod.js” in editor and replace
hui-state-label-badge → hui-state-badge-element

Ofc it may stop working some day )))
Unfortunately, there is no way to restore a “change name/icon” functionality. (you may change a name like it is proposed for a state-badge in picture-elements)

Update:
You may style old-style badges even w/o hacking a js-file - just use mod-card (described here).
Next, in card-mod 4.x it is possible to style them with and w/o mod-card (described here).

1 Like