hi,
for the fun of it, I am trying to have a custom-fields button spin, with a speed based on the actual fanspeed of an entity, sensor.argon_one_addon_fan_speed, and following the states it can have, as you see in the color template below
Of course I’ve read @Ildar_Gabdullin on Lovelace: mini graph card - #1706 by Ildar_Gabdullin but am still a bit stuck on how to move that to a button-card, so seek some assistance please…
this is my button:

template:
- button_body
- plot_list
entity: sensor.cpu_temperature
variables:
plot_entities: >
[[[ return [entity.entity_id,
states['sensor.attic_sensor_calibrated_temperature'].entity_id
];
]]]
name: Cpu temp
custom_fields:
fan:
>
[[[ return `<ha-icon icon=mdi:fan style='width:15px;color: var(--speed-color);'> </ha-icon>
<span style='color: var(--primary-color);'>
${states['sensor.argon_one_addon_fan_speed'].state} % </span>`; ]]]
styles:
custom_fields:
fan:
- font-size: 11px
- font-weight: bold
- padding: 0px 3px
- position: absolute
- right: 5%
- top: 10%
- --speed-color: >
[[[ var speed = states['sensor.argon_one_addon_fan_speed'].state;
var mapper = {0:'green',
1:'darkgreen',
3:'orange',
33:'orangered'
66:'maroon'}
return mapper[speed] ? mapper[speed] : 'red' ; ]]]
state:
- operator: '<'
value: 50
styles:
card:
- color: green
- operator: '<'
value: 60
styles:
card:
- color: darkgreen
- operator: '<'
value: 70
styles:
card:
- color: orange
- operator: '<'
value: 80
styles:
card:
- color: maroon
- default:
styles:
card:
- color: red
appreciate a little help here, thanks!