Custom button card image icon

Share your Projects! Dashboards & Frontend
1

Hello

im sure there is an easy fix for this but i cant seem to get it.
Im new to HA and im trying to create a custom button, the button does what i want it to do but i want to use a PNG image (installed in /www) instead of an mdi:icon as the “icon”

this is the code i have thus far:

show_name: true
show_icon: true
styles:
card:
- border-radius: 30%
- background-color: white
type: button
tap_action:
action: navigate
navigation_path: /dashboard-kiosk/energy
name: Power

2

I would check out custom:button-card installed via HACs

3

thats what im using but cant get the png image to show.

not sure if im inputting the YAML correctly

4

Your code show you using the standard button card, not a custom one

5

Managed to get it in to custom:button-card

type: custom:button-card
tap_action:
action: navigate
navigation_path: /dashboard-kiosk/energy
name: Power
show_name: true
show_icon: true
entity_picture: /local/Lightning.bolt.png
show_entity_picture: true
size: 22px
styles:
card:
- border-radius: null
- background-color: null

Still unable to get the image to display

6

this worked:

type: custom:button-card
tap_action:
action: navigate
navigation_path: /dashboard-kiosk/energy
name: Energy
show_name: true
show_icon: false
show_entity_picture: true
entity: null
entity_picture: /local/Lightning_bolt.png
size: 100px
aspect_ratio: 4/4
styles:
card:
- height: 180px
- width: 180px
- border-radius: null
- background-color: null