Tile card icon size

Bonjour,

La carte ‹ Tile card › évoluant au fil des versions et notamment dans la dernière version de HA 2025.3
Progressivement j’essaie de simplifier mon HA, j’ai basculé pas mal de cartes de mushromm à tile (light, door, switch) avec des résultats équivalents à mushroom.
Mais il y en a encore ou je n’ai pas trouvé de solution, pas de problème pour le changement de couleur des icones mais je bute sur la taille des icones pour arriver à cet exemple :

code carte mushroom
  mushroom-card_switch_1:
    card:
      type: custom:mushroom-template-card
      primary: '[[name]]'
      secondary: |-
        {% if is_state(config.entity, 'off') %}
          désactivé
        {% elif is_state(config.entity, 'on') %}
          activé
        {% else %}  
          indisponible
        {% endif %} 
      icon: mdi:[[icon]]
      entity: '[[entity]]'
      icon_color: |-
        {% if is_state(config.entity, 'off') %}
          grey
        {% elif is_state(config.entity, 'on') %}
          orange
        {% else %}  
          red
        {% endif %}  
      badge_icon: ''
      badge_color: ''
      layout: horizontal
      fill_container: false
      tap_action:
        action: more-info
      hold_action:
        action: none
      double_tap_action:
        action: none
      card_mod:
        style: |
          :host {
            --mush-icon-size: 70px;
            --mush-icon-symbol-size: 55px;
          }
          ha-card {
            box-shadow: none;
          }

Pour l’instant le résultat n’est pas terrible avec la carte tile

code carte tile
type: horizontal-stack
cards:
  - type: tile
    features_position: bottom
    vertical: false
    entity: switch.portail_switch_0
    card_mod:
      style: |
        ha-tile-icon {
          {% if is_state(config.entity, 'off') %}
            --tile-icon-color: green !important;
          {% else %}
            --tile-icon-color: orange !important;
          {% endif %}
        }
        ha-tile-icon {
          --mdc-icon-size: 38px;
        }
grid_options:
  columns: 12
  rows: 2

j’arrive à modifier la taille de l’icone mais pas le fond de carte de l 'icone

Est ce que quelqu’un aurait trouvé la solution ?
Merci

Salut,
test ce code:

card_mod:
  style:
    ha-tile-icon$: |
      div {
        width: 50px !important;
        height: 50px !important;
        border-radius: 50% !important;
      }
    .: |
      ha-tile-icon {
        {% if is_state(config.entity, 'off') %}
          --tile-icon-color: green !important;
        {% else %}
          --tile-icon-color: orange !important;
        {% endif %}
        --mdc-icon-size: 38px;
      } 

avant:
image
après:

Super
Merci beaucoup

1 « J'aime »

Une question quand même, ça fait plusieurs jours que je lis la doc de card mod, que je recherche sur le forum anglophone, sans vraiment de résultat,
comment fais tu ?, tu as des filons cachés ?, c’est inné ?, :grinning:

J’utilise l’outil de développement de chrome ( F12 ). Je sélectionne la partie à analyser pour voir le CSS utiliser. Après, c’est avec l’habitude et l’aide de @Herbs qui m’a dépanné plusieurs fois pour modifier du CSS.

Il y a un tuto vidéo fait par @Clemalex, qui aide beaucoup :

1 « J'aime »

Salut messieurs,

@pctetra tu peux trouver pas mal de choses déjà documentées ici et :wink:

1 « J'aime »

@WarC0zes et @Herbs

Merci à vous deux pour vos réponses