Headers & Footers for Lovelace cards


Some Lovelace cards have support for header and footer widgets. These widgets fill up the whole available space in a card.

Screenshot of an entities card with a picture header. Screenshot of an entities card with a picture header and buttons footer.

Picture header & footer

Widget to show a picture as a header or a footer. A picture can have touch actions associated with it.

type: picture
image: 'https://www.home-assistant.io/images/lovelace/header-footer/balloons-header.png'

Configuration Variables

type

(string)(Required)

picture

image

(string)(Required)

The URL of an image.

tap_action

(map)(Optional)

Action to take on tap.

hold_action

(map)(Optional)

Action to take on tap-and-hold

double_tap_action

(map)(Optional)

Action to take on double tap

Buttons header & footer

Widget to show entities as buttons in the header or footer.

type: buttons
entities:
  - script.launch_confetti
  - entity: script.swirl_lights
    icon: 'mdi:track-light'
  - entity: script.run_siren
    icon: 'mdi:alarm-light'

Configuration Variables

entities

(list)(Required)

A list of entities to show. Each entry is either an entity ID or a map.

entity

(string)(Required)

The entity to render.

icon

(string)(Optional)

Override the entity icon.

image

(string)(Optional)

Override the entity image.