How to change icon in tile card

Configuration Frontend
1

Hi all,

I wrote down the following code:

- type: custom:vertical-stack-in-card
    cards:
      - type: vertical-stack
        cards:
          - features:
              - type: cover-position
            type: tile
            entity: cover.tapparella_della_camera
            icon: mdi:window-shutter
            color: white
            name: Tapparella
          - type: horizontal-stack
            cards:
              - type: custom:button-card
                tap_action:
                  action: call-service
                  service: cover.set_cover_position
                  service_data:
                    position: 0
                    entity_id: cover.tapparella_della_camera
                entity: cover.tapparella_della_camera
                name: Close
                show_icon: false
                card_mod:
                  style: |
                    ha-card {
                      --ha-card-background: 
                      {% if is_state_attr('cover.tapparella_della_camera', 'current_position', 0) %}
                        green;
                        color: white;
                      {% endif %}
                    }
                styles:
                  card:
                    - border: 0px 0px 0px 0px
                    - border-radius: 0%
                    - box-shadow: 0px 0px 0px 0px
              - type: custom:button-card
                tap_action:
                  action: call-service
                  service: cover.set_cover_position
                  service_data:
                    position: 50
                    entity_id: cover.tapparella_della_camera
                entity: cover.tapparella_della_camera
                name: 50%
                show_icon: false
                card_mod:
                  style: |
                    ha-card {
                      --ha-card-background: 
                      {% if is_state_attr('cover.tapparella_della_camera', 'current_position', 50) %}
                        green;
                        color: white;
                      {% endif %}
                    }
                styles:
                  card:
                    - border: 0px 0px 0px 0px
                    - border-radius: 0%
                    - box-shadow: 0px 0px 0px 0px
              - type: custom:button-card
                tap_action:
                  action: call-service
                  service: cover.set_cover_position
                  service_data:
                    position: 100
                    entity_id: cover.tapparella_della_camera
                entity: cover.tapparella_della_camera
                name: Open
                show_icon: false
                card_mod:
                  style: |
                    ha-card {
                      --ha-card-background: 
                      {% if is_state_attr('cover.tapparella_della_camera', 'current_position', 100) %}
                        green;
                        color: white;
                      {% endif %}
                    }
                styles:
                  card:
                    - border: 0px 0px 0px 0px
                    - border-radius: 0%
                    - box-shadow: 0px 0px 0px 0px

In order to get this tile card:

image

But I’d like to change the icon if the cover is in the following states (as example):

  • if it has a position <= 22%
  • if it has a position > 22% and != 50%
    -if it has a position == 50%

is there a chance to implement in the above code?

2

The simplest way is to create several tile cards with different icons and make visibility conditional on the position of the cover.

3
  1. Your posted code contains only a few lines related to the Tile card. If you wish to distract people - ok, otherwise post only a related code.
  2. Check if this cover entity changes it’s icon automatically dependently on a state. It is supposed to. If you need a different behavior - consider using:
    — either card-mod (discussed in a dedicated card-mod thread);
    — or config-template-card (or similar) (also discussed in dedicated thread).