home-assistant.io/source/_dashboards/vertical-stack.markdown

type, title, sidebar_label, description, related

type	title	sidebar_label	description	related
card	Vertical stack card	Vertical stack	The vertical stack card allows you to group multiple cards so they always sit in the same column.	docs title /dashboards/cards/ Dashboard cards

The vertical stack card allows you to group multiple cards so they always sit in the same column.

{% include dashboard/edit_dashboard.md %}

YAML configuration

The following YAML options are available when you use YAML mode or just prefer to use YAML in the code editor in the UI.

{% configuration %} type: required: true description: "vertical-stack" type: string title: required: false description: Title of stack. type: string cards: required: true description: List of cards. type: list {% endconfiguration %}

Examples

Basic example:

type: vertical-stack
title: Backyard
cards:
  - type: picture-entity
    entity: camera.demo_camera
    show_info: false
  - type: entities
    entities:
      - binary_sensor.movement_backyard

Picture and entities-card in a stack.

Combination of vertical and horizontal stack card:

type: vertical-stack
cards:
  - type: picture-entity
    entity: group.all_lights
    image:  /local/house.png
  - type: horizontal-stack
    cards:
      - type: picture-entity
        entity: light.ceiling_lights
        image: /local/bed_1.png
      - type: picture-entity
        entity: light.bed_light
        image: /local/bed_2.png

Create a grid layout using vertical and horizontal stack.