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

From Issue 470

What I expected to happen: No line break (true up through 2025.9), like this:

What happened instead (image is from 2025.10.0b4, no configuration change made):

 - type: tile
   entity: switch.iris_2
   name: Dehumidifier
   features_position: bottom
   vertical: false
   tap_action:
     action: navigate
     navigation_path: history?entity_id=sensor.iris_2_power
   card_mod:
     style:
       ha-tile-info$: |
         .secondary:after {
           visibility: visible;
           content:
             "{% if is_state(config.entity, 'on') %}"
               "• {{ states('sensor.iris_2_power') }}W"
             "{% endif %}";
         }

ha-tile-info updated to use slots in 2025.10. So no need to go to shadow dom, and also can target state-display. So try …

...
card_mod:
  style:
    ha-tile-info: |
      state-display:after {
        visibility: visible;
        content:
          "{% if is_state(config.entity, 'on') %}"
            "• {{ states('sensor.iris_2_power') }}W"
          "{% endif %}";
      }
5 Likes