SMARTi watermark
Drag & Drop Card Wiki · Section 05.5

Layers

A comprehensive and user-friendly guide to creating modern, polished, and fully responsive Home Assistant dashboards using the Drag & Drop Card. This wiki combines clear explanations, practical real-world configuration examples, step-by-step walkthroughs, and visual references where they add the most value — making it easy for both beginners and advanced users to design powerful and visually appealing dashboards.

12 sections Config examples HADS-ready exports
Demo focus
Drag, resize, snap, export.
Add screenshots from admin to turn this section into a richer visual guide.

Layers

Layers let you show and hide groups of cards inside the same Drag & Drop canvas.

They are useful when you want different dashboard modes without creating separate tabs or moving cards around. For example, you can create layers for Day, Night, Guests, Cleaning, Energy, Security, or Maintenance. Each layer can contain its own set of cards, and you can toggle those cards on or off from the layer controls.

Layers work on top of tabs. This means a card still belongs to a tab, but it can also belong to one or more layers. This makes it possible to keep the same tab layout while switching between different visual states or dashboard modes.

When layers are enabled, cards can be assigned to layers from the card settings menu in Edit Mode. If a card is not assigned to any layer, it stays visible as a normal card. If a card is assigned to one or more layers, it will only appear when those layers are active.

Use layers when you want a more dynamic dashboard. For example, a Home tab can show your everyday controls by default, but you can activate a Security layer to reveal cameras, alarm controls, locks, and door sensors. You can also use a Night layer to show dimmed controls, bedtime buttons, or only the most important information.

Current Layers settings

Enable layers turns the layer system on or off for the dashboard.

Add layer creates a new layer. Use clear names that describe the mode or purpose, such as Night, Guests, Security, Energy, or Maintenance.

Each layer can have its own name, icon, and color. This makes it easier to recognize layers quickly in the layer bar.

Layers can be renamed, reordered, or removed from the Layers settings. The card assignments use stable internal IDs, so renaming a layer does not break the cards assigned to it.

Recommended use

Use tabs for larger sections of the dashboard, such as rooms or main categories.

Use layers for temporary modes, overlays, or context-specific controls inside those sections.

A good setup is to keep the main dashboard clean, then use layers to reveal advanced controls only when they are needed.

Settings reference

Dashboard settingYAML settingWhat it doesValue possibilities
Enable layerslayers_enabledTurns the layer system on or off for the dashboard.true or false.
Add layer / Layers listlayersDefines the layers users can toggle.List of layers with id, label, icon, color, and active state.
Layer starts activedefault_activeChooses whether a layer is visible when the dashboard first loads.true or false for each layer where supported.
Card layer assignmentlayerIdsAssigns a card to one or more layers.List of layer ids assigned to a card.
Last updated 2026-05-27.