Why are you using a conditional chip if you want it to display all the time?
Thats a copied code I was running and now I want to change it but havenāt got any experience yet 
Ah, no problem, I found it tricksy to get my head around it all at first. 
This whole thread is well worth a read through, Iāve gotten some great ideas from what other have posted and am on my way to a dashboard Iām really happy with.
Try thisā¦
- type: custom:mushroom-chips-card
chips:
- type: template
icon_color: '{{ ''red'' if is_state(entity, ''on'') else ''disabled'' }}'
icon: mdi:power-plug
tap_action:
action: more-info
entity: switch.abr_steckdose_switch
Thanks a lot buddy for your help
Unfortunately, it is just not working 
Thats the code but it doesnāt show the switch - neither on nor off
- type: custom:mushroom-chips-card
chip:
- type: template
icon_color: '{{ ''orange'' if is_state(entity, ''on'') else ''green'' }}'
icon: mdi:power-plug
tap_action:
action: more-info
entity: switch.hwr_steckdose_switch
- type: custom:mushroom-chips-card
chip:
- type: template
icon_color: '{{ ''orange'' if is_state(entity, ''on'') else ''green'' }}'
icon: mdi:power-plug
tap_action:
action: more-info
entity: switch.abr_steckdose_switch
Oh, I see, chip: should be chips:
How can change the title font on ācustom:mushroom-title-cardā? Iām trying with bellow code but i canāt even in inspect element worksā¦
type: custom:mushroom-title-card
title: šļø Living Room
alignment: center
subtitle: ''
card_mod:
style: |
ha-card {
--title-font-size: var(--mush-title-font-size, 15px);
}
Also i want to have different colors when have changes in battery on phones. I tried this but not workā¦
type: custom:mushroom-entity-card
entity: sensor.iphone_battery_level
layout: vertical
icon: ''
primary_info: state
secondary_info: name
name: iPhone
card_mod:
style: |
:host {
--rgb-state-entity: var(--mush-rgb-state-entity:
{% if states(sensor.iphone_battery_level) | float(0) >= 80 %}
green
{% elif states(sensor.iphone_battery_level) | float(0) >= 50 %}
orange
{% elif states(sensor.iphone_battery_level) | float(0) >= 35 %}
red
{% else %}
green
{% endif %};
Thanks!
Just saw this, this is great mate, how do you do this for vertical card??
1 Like
EDIT: Changed from stack-in-card and tweaked it to work.
Also added this to theme masonry-view-card-margin: 0px 0px 0px 0px
type: custom:layout-card
layout_type: custom:grid-layout
cards:
- type: custom:mushroom-template-card
primary: Av
secondary: ''
icon: mdi:fan-off
tap_action:
action: call-service
service: fan.turn_off
data: {}
target:
entity_id: fan.storblas
icon_color: |-
{% if states('fan.storblas') == "off" %} red {% else %}
grey
{% endif %}
card_mod:
style:
.: |
:host {
{% if states('fan.storblas') == "off" %}
--primary-text-color: var(--red-color);
--secondary-text-color: var(--red-color);
{% else %}
--primary-text-color: gray;
{% endif %}
}
ha-card {
--ha-card-border-width: 1px !important;
--ha-card-border-radius: 28px 0px 0px 28px;
{% if states('fan.storblas') == "off" %}
background: rgba(var(--mush-rgb-red), 0.1);
--ha-card-border-color: var(--google-active-card) !important;
{% endif %}
}
- type: custom:mushroom-template-card
primary: PĆ„
secondary: ''
icon: mdi:fan
tap_action:
action: call-service
service: fan.turn_on
data: {}
target:
entity_id: fan.storblas
icon_color: |-
{% if states('fan.storblas') == "on" %} green {% else %}
gray
{% endif %}
card_mod:
style:
.: |
:host {
{% if states('fan.storblas') == "on" %}
--primary-text-color: var(--green-color);
--secondary-text-color: var(--green-color);
{% else %}
--primary-text-color: gray;
{% endif %}
}
ha-card {
--ha-card-border-width: 1px !important;
--ha-card-border-radius: 0px 28px 28px 0px;
{% if states('fan.storblas') == "on" %}
background: rgba(var(--mush-rgb-green), 0.1);
--ha-card-border-color: var(--google-active-card) !important;
{% endif %}
}
layout:
grid-template-columns: 1fr 1fr
OG post:
Iām not sure whatās going on here but for some reason on refresh I randomly getās margin between my mushroom in a stack-in-card. I donāt know if this is mushroom or stack-in but if anyone of you had this problem please let me know how to fix it. It only happens randomly.
Wrong
Right
type: custom:stack-in-card
keep:
border_radius: true
background: true
mode: horizontal
cards:
- type: custom:mushroom-template-card
primary: Av
secondary: ''
icon: mdi:fan-off
tap_action:
action: call-service
service: fan.turn_off
data: {}
target:
entity_id: fan.lillblas
icon_color: |-
{% if states('fan.lillblas') == "off" %} red {% else %}
grey
{% endif %}
card_mod:
style:
.: |
:host {
{% if states('fan.lillblas') == "off" %}
--primary-text-color: var(--red-color);
--secondary-text-color: var(--red-color);
{% else %}
--primary-text-color: gray;
{% endif %}
}
ha-card {
--ha-card-border-width: 1px !important;
--ha-card-border-radius: 28px 0px 0px 28px;
{% if states('fan.lillblas') == "off" %}
background: rgba(var(--mush-rgb-red), 0.1);
--ha-card-border-color: var(--google-active-card) !important;
{% endif %}
}
- type: custom:mushroom-template-card
primary: PĆ„
secondary: ''
icon: mdi:fan
tap_action:
action: call-service
service: fan.turn_on
data: {}
target:
entity_id: fan.lillblas
icon_color: |-
{% if states('fan.lillblas') == "on" %} green {% else %}
gray
{% endif %}
card_mod:
style:
.: |
:host {
{% if states('fan.lillblas') == "on" %}
--primary-text-color: var(--green-color);
--secondary-text-color: var(--green-color);
{% else %}
--primary-text-color: gray;
{% endif %}
}
ha-card {
--ha-card-border-width: 1px !important;
--ha-card-border-radius: 0px 28px 28px 0px;
{% if states('fan.lillblas') == "on" %}
background: rgba(var(--mush-rgb-green), 0.1);
--ha-card-border-color: var(--google-active-card) !important;
{% endif %}
}
card_mod:
style:
.: |
ha-card {
background: transparent !important;
}
1 Like
Keen to see this once itās complete! Very much what Iāve been looking for, if only there was a way to subscribe to a ātell me when completeā topic on here!
I try to put an animation on the icons of the conditional chip-cards.
But impossible to find a solution that works for the different chip-cards, only the first one is animated.
Here is the code:
type: custom:stack-in-card
cards:
- type: custom:mushroom-chips-card
alignment: end
chips:
- type: conditional
conditions:
- entity: input_boolean.update
state: 'on'
chip:
type: template
entity: input_boolean.notifications
icon: mdi:bell
tap_action:
action: none
hold_action:
action: none
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-box-shadow: {{ "0px 0px 30px red" if is_state('input_boolean.update', 'on') }};
}
/* Notification indicator */
ha-card:after {
/* Turn on indicator if there is a notification */
{% set notifications = (expand(states.group.grp_update_all) | selectattr('state', 'eq', 'on') | list | count) %}
{% if notifications > 0 %}
content: "{{ expand(states.group.grp_update_all) | selectattr( 'state', 'eq', 'on') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-red));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.3em;
{% endif %}
/* Position & style notification */
position: absolute;
background: rgb(var(--rgb-red));
border-radius: 50%;
top: -3px;
right: -3px;
width: 15px;
height: 15px;
}
- type: conditional
conditions:
- entity: input_boolean.update
state: 'on'
chip:
type: template
entity: input_boolean.notifications
icon: mdi:store
tap_action:
action: none
hold_action:
action: none
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-box-shadow: {{ "0px 0px 30px red" if is_state('input_boolean.update', 'on') }};
}
/* Notification indicator */
ha-card:after {
{% if states('sensor.hacs', ['1','2','3','4','5','6','7','8','9','10']) %}
content: "{{ states('sensor.hacs') |float |int }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-red));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.3em;
{% endif %}
/* Position & style notification */
position: absolute;
background: rgb(var(--rgb-red));
border-radius: 50%;
top: -3px;
right: -3px;
width: 15px;
height: 15px;
}
card_mod:
style:
mushroom-template-chip:nth-child(1)$: |
ha-icon {
animation: boing 1.5s ease infinite;
transform-origin: 50% 90%;
}
@keyframes boing {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}
mushroom-template-chip:nth-child(2)$: |
ha-icon {
animation: fade-out 1.5s infinite;
transform-origin: 50% 90%;
}
@keyframes fade-out {
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
mushroom-template-chip:nth-child(3)$: |
ha-icon {
animation: sprinkle 2s linear infinite;
transform-origin: 29% 88%;
}
@keyframes sprinkle {
0%, 15%, 30%, 45%, 60%, 100% { clip-path: inset(0 55% 0 0); transform: rotate(0deg); }
1%, 16%, 31%, 46% { clip-path: inset(0 0 0 0); transform: rotate(-10deg); }
6%, 21%, 36%, 51% { transform: rotate(2deg); }
}
card_mod:
style: |
/* Remove styling from top card with chips */
ha-card {
/* Allow pseudo elements to display outside card */
overflow: visible !important;
/* Remove gap at top of card */
/* margin-top: calc(-1 * var(--mush-chip-spacing, 8px));
/* Remove styling from card */
box-shadow: none;
border: none;
background: none;
padding: var(--mush-chip-spacing, 8px);
transition: all 0s;
}
/* Make card sticky at top of page */
:host {
position: sticky;
z-index: 4;
top: 170px;
/* Add background to host to prevent transparent card */
border-radius: var(--ha-card-border-radius, 12px);
/* Assign album art color to variable used in sticky media player */
{% if is_state('binary_sensor.ping_dalg_pc', 'on') %}
{% elif is_state('binary_sensor.ping_dalg_dell', 'on') %}
{% elif is_state('input_boolean.notifications', 'on') %}
{% else %}
/* Hide the sticky media player when it is idle */
display: none !important;
{% endif %}
}
/* Pseudo element to hide card styling when at top */
ha-card:after {
content: "";
top: 0px;
position: fixed;
/* Center element on page */
left: 50%;
transform: translateX(-50%);
/* Position between chips and background pseudo elemnt */
z-index: -1;
/* Match background to main card */
/* background: color-mix(in srgb, var(--card-background-color) 40%, var(--primary-background-color));
/* border-radius: 0px 0px var(--ha-card-border-radius, 12px) var(--ha-card-border-radius, 12px);
/* Adjust opacity of card */
background: rgba(var(--rgb-card-background-color), 0.3);
/* Set styling of card */
border-radius: var(--ha-card-border-radius, 12px);
box-shadow: var(--ha-card-box-shadow);
border: var(--ha-card-border-width, 1px) solid var(--ha-card-border-color, var(--divider-color, #e0e0e0));
}
/* Pseudo element for background & other card styling */
ha-card:before {
content: "";
/* Position & size card behind chips */
position: absolute;
top: 0px;
left: 0px;
height: 100%;
/* Adjust width to account for border */
width: calc(100% - 2 * var(--ha-card-border-width, 1px));
/* Blur content behind card */
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
/* Adjust opacity of card */
/* background: rgba(var(--rgb-card-background-color), 0.3);
/* Set styling of card */
/* border-radius: var(--ha-card-border-radius, 12px);
/* box-shadow: var(--ha-card-box-shadow);
/* border: var(--ha-card-border-width, 1px) solid var(--ha-card-border-color, var(--divider-color, #e0e0e0));
/* Adjust opacity of card */
background: transparent;
/* Set styling of card */
border-radius: var(--ha-card-border-radius, 12px);
box-shadow: none;
border: none;
}
@Rhysb (Kudos) has shared a lot of animation in a sequence of 5 posts. In one of these is the right handling of chip animations described.
1 Like
thank you for the answer
I found solution :
add this to each card:
card_mod:
style: |
.content {
animation: boing 3s ease infinite;
transform-origin: 50% 90%;
}
@keyframes boing {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}
Complete code :
type: custom:stack-in-card
cards:
- type: custom:mushroom-chips-card
alignment: end
chips:
- type: conditional
conditions:
- entity: input_boolean.update
state: 'on'
chip:
type: template
entity: input_boolean.notifications
icon: mdi:bell
tap_action:
action: none
hold_action:
action: none
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-box-shadow: {{ "0px 0px 30px red" if is_state('input_boolean.update', 'on') }};
}
/* Notification indicator */
ha-card:after {
/* Turn on indicator if there is a notification */
{% set notifications = (expand(states.group.grp_update_all) | selectattr('state', 'eq', 'on') | list | count) %}
{% if notifications > 0 %}
content: "{{ expand(states.group.grp_update_all) | selectattr( 'state', 'eq', 'on') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-red));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.3em;
{% endif %}
/* Position & style notification */
position: absolute;
background: rgb(var(--rgb-red));
border-radius: 50%;
top: -3px;
right: -3px;
width: 15px;
height: 15px;
}
.content {
animation: fade-out 1.5s infinite;
transform-origin: 50% 90%;
}
@keyframes fade-out {
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
- type: conditional
conditions:
- entity: input_boolean.update
state: 'on'
chip:
type: template
entity: input_boolean.notifications
icon: mdi:store
tap_action:
action: none
hold_action:
action: none
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-box-shadow: {{ "0px 0px 30px red" if is_state('input_boolean.update', 'on') }};
}
/* Notification indicator */
ha-card:after {
{% if states('sensor.hacs', ['1','2','3','4','5','6','7','8','9','10']) %}
content: "{{ states('sensor.hacs') |float |int }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-red));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.3em;
{% endif %}
/* Position & style notification */
position: absolute;
background: rgb(var(--rgb-red));
border-radius: 50%;
top: -3px;
right: -3px;
width: 15px;
height: 15px;
}
.content {
animation: boing 3s ease infinite;
transform-origin: 50% 90%;
}
@keyframes boing {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}
card_mod:
style: |
/* Remove styling from top card with chips */
ha-card {
/* Allow pseudo elements to display outside card */
overflow: visible !important;
/* Remove gap at top of card */
/* margin-top: calc(-1 * var(--mush-chip-spacing, 8px));
/* Remove styling from card */
box-shadow: none;
border: none;
background: none;
padding: var(--mush-chip-spacing, 8px);
transition: all 0s;
}
/* Make card sticky at top of page */
:host {
position: sticky;
z-index: 4;
top: 170px;
/* Add background to host to prevent transparent card */
border-radius: var(--ha-card-border-radius, 12px);
/* Assign album art color to variable used in sticky media player */
{% if is_state('binary_sensor.ping_dalg_pc', 'on') %}
{% elif is_state('binary_sensor.ping_dalg_dell', 'on') %}
{% elif is_state('input_boolean.notifications', 'on') %}
{% else %}
/* Hide the sticky media player when it is idle */
display: none !important;
{% endif %}
}
/* Pseudo element to hide card styling when at top */
ha-card:after {
content: "";
top: 0px;
position: fixed;
/* Center element on page */
left: 50%;
transform: translateX(-50%);
/* Position between chips and background pseudo elemnt */
z-index: -1;
/* Match background to main card */
/* background: color-mix(in srgb, var(--card-background-color) 40%, var(--primary-background-color));
/* border-radius: 0px 0px var(--ha-card-border-radius, 12px) var(--ha-card-border-radius, 12px);
/* Adjust opacity of card */
background: rgba(var(--rgb-card-background-color), 0.3);
/* Set styling of card */
border-radius: var(--ha-card-border-radius, 12px);
box-shadow: var(--ha-card-box-shadow);
border: var(--ha-card-border-width, 1px) solid var(--ha-card-border-color, var(--divider-color, #e0e0e0));
}
/* Pseudo element for background & other card styling */
ha-card:before {
content: "";
/* Position & size card behind chips */
position: absolute;
top: 0px;
left: 0px;
height: 100%;
/* Adjust width to account for border */
width: calc(100% - 2 * var(--ha-card-border-width, 1px));
/* Blur content behind card */
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
/* Adjust opacity of card */
/* background: rgba(var(--rgb-card-background-color), 0.3);
/* Set styling of card */
/* border-radius: var(--ha-card-border-radius, 12px);
/* box-shadow: var(--ha-card-box-shadow);
/* border: var(--ha-card-border-width, 1px) solid var(--ha-card-border-color, var(--divider-color, #e0e0e0));
/* Adjust opacity of card */
background: transparent;
/* Set styling of card */
border-radius: var(--ha-card-border-radius, 12px);
box-shadow: none;
border: none;
}
3 Likes
I have no idea, what I am doing wrong - just doesnāt show any plugs 
- type: custom:mushroom-chips-card
chips:
- type: template
icon_color: '{{ ''orange'' if is_state(entity, ''on'') else ''green'' }}'
icon: mdi:power-plug
tap_action:
action: more-info
entity: switch.hwr_steckdose_switch
- type: custom:mushroom-chips-card
chips:
- type: template
icon_color: '{{ ''orange'' if is_state(entity, ''on'') else ''green'' }}'
icon: mdi:power-plug
tap_action:
action: more-info
entity: switch.abr_steckdose_switch
Hi there,
again i have a problem with an animation in a chip. This card is based on @rhysb room card.
There should be an animated fountain icon if the fountain is on. If i put the card mod directly to the chip it is working more or less. Compared to the animation in a template card it just blinks the water part.
And the secon method shown below doen not animate anything
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
primary: Garten & Terasse
secondary: '{{ states(''sensor.ga_multisensor_temperature'') }} Ā°C'
picture: /local/areas/patio.jpg
entity: light.pa_lights
tap_action:
action: navigate
navigation_path: patio
hold_action:
action: call-service
service: light.turn_off
target:
entity_id: light.pa_lights
fill_container: true
layout: horizontal
card_mod:
style: |
:host {
background:
{% if is_state('light.pa_lights', 'on') %}
rgba(var(--rgb-yellow), 0.2);
{% else %}
rgba(var(--rgb-primary-text-color), 0.025);
{% endif %}
--mush-icon-size: 76px;
--ha-card-border-width: 0;
height: 66px;
margin-left: -24px !important;
}
- type: custom:mushroom-chips-card
alignment: end
chips:
- type: conditional
conditions:
- entity: switch.pa_fountain
state: 'on'
chip:
type: template
icon_color: blue
icon: mdi:fountain
card_mod:
style: |
mushroom-conditional-chip:nth-child(1)$: |
ha-icon {
animation: fountain 1.5s ease infinite;
}
@keyframes fountain {
0%, 100 { clip-path: polygon(0 100%, 0 0, 100% 0, 100% 100%); }
50% { clip-path: polygon(0 100%, 0 47%, 100% 47%, 100% 100%); }
60% { clip-path: polygon(0 100%, 100% 100%, 100% 37%, 79% 36%, 71% 21%, 56% 25%, 44% 25%, 31% 20%, 20% 36%, 0 36%); }
70% { clip-path: polygon(0 100%, 100% 100%, 100% 36%, 79% 36%, 71% 22%, 81% 1%, 24% 0, 31% 21%, 20% 36%, 0 36%); }
80% { clip-path: polygon(0 100%, 100% 100%, 100% 36%, 79% 36%, 76% 28%, 100% 0, 0 0, 23% 28%, 20% 36%, 0 36%); }
}
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0;
--chip-border-width: 0;
card_mod:
style: |
ha-card {
height: 102px;
}
What do i do wrong? Any help/hint is appreciated
1 Like
Hi
I wrote the solution above.
Here is your code:
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
primary: Garten & Terasse
secondary: '{{ states(''sensor.ga_multisensor_temperature'') }} Ā°C'
picture: /local/areas/patio.jpg
entity: light.pa_lights
tap_action:
action: navigate
navigation_path: patio
hold_action:
action: call-service
service: light.turn_off
target:
entity_id: light.pa_lights
fill_container: true
layout: horizontal
card_mod:
style: |
:host {
background:
{% if is_state('light.pa_lights', 'on') %}
rgba(var(--rgb-yellow), 0.2);
{% else %}
rgba(var(--rgb-primary-text-color), 0.025);
{% endif %}
--mush-icon-size: 76px;
--ha-card-border-width: 0;
height: 66px;
margin-left: -24px !important;
}
- type: custom:mushroom-chips-card
alignment: end
chips:
- type: conditional
conditions:
- entity: switch.pa_fountain
state: 'on'
chip:
type: template
icon_color: blue
icon: mdi:fountain
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0;
--chip-border-width: 0;
}
.content {
animation: fountain 1.5s ease infinite;
}
@keyframes fountain {
0%, 100 { clip-path: polygon(0 100%, 0 0, 100% 0, 100% 100%); }
50% { clip-path: polygon(0 100%, 0 47%, 100% 47%, 100% 100%); }
60% { clip-path: polygon(0 100%, 100% 100%, 100% 37%, 79% 36%, 71% 21%, 56% 25%, 44% 25%, 31% 20%, 20% 36%, 0 36%); }
70% { clip-path: polygon(0 100%, 100% 100%, 100% 36%, 79% 36%, 71% 22%, 81% 1%, 24% 0, 31% 21%, 20% 36%, 0 36%); }
80% { clip-path: polygon(0 100%, 100% 100%, 100% 36%, 79% 36%, 76% 28%, 100% 0, 0 0, 23% 28%, 20% 36%, 0 36%); }
}
card_mod:
style: |
ha-card {
height: 102px;
}
@Guizmos Thanks for your help. As described the animation with the card mod directly at the chip is working, but not as expected.
This is the animation in a template card
And this is the animation in the chips card
As you see the template animation is like a fountain and the chip animation is like blinking.
So the big question is Why!
Your animation is set for a large icon size.
I wouldnāt be able to modify it to fit the chip-card icon.
By enlarging the icon we can see that it is well animated correctly
1 Like
Thats the point. Thanks. Like we say in germany: Too many trees to see the woods
1 Like
HI,
how did you fix the spacing on the board?