Wer Home Assistant lange betreibt, kennt das Phänomen: Die Automationen laufen perfekt, hundert Entitäten erledigen ihre Aufgabe im Hintergrund – aber das Dashboard sieht aus wie eine Excel-Tabelle aus dem Jahr 2008. Lange Listen mit Schaltern, viel Weiss, kaum Hierarchie. Das funktioniert für den Admin, aber jedes andere Familienmitglied weicht aufs Sprachkommando aus. Wer 2026 ein Dashboard bauen will, das auch die Mitbewohner gerne benutzen, kommt an zwei Custom-Card-Sammlungen nicht vorbei: Mushroom Cards und Bubble Cards. Beide sind über HACS installierbar, beide stabil und gepflegt, beide ergänzen sich in der Praxis hervorragend.
Warum die Standard-Cards an Grenzen stossen
Das Lovelace-Frontend liefert von Haus aus solide Bausteine: entities, entity, tile, light, thermostat. Sie funktionieren, sind aber visuell zurückhaltend. Wer ein Smartphone-natives, fingerfreundliches Dashboard bauen will – mit klaren Touch-Zielen, Animationen, sinnvoll gruppierten Räumen – gerät schnell an die Limits. Genau in diese Lücke stossen Mushroom und Bubble: Sie liefern dichtere Information pro Fläche, schöneres Styling und Interaktionsmuster, die man von kommerziellen Smarthome-Apps kennt.
Schritt 1: HACS und Installation
Voraussetzung ist eine funktionierende HACS-Installation. In HACS unter «Frontend» nach Mushroom und Bubble Card suchen, beide installieren, Home Assistant neustarten. Anschliessend müssen die Ressourcen geladen werden – bei HACS-Installation passiert das in modernen HA-Versionen automatisch, ansonsten unter Einstellungen → Dashboards → Ressourcen manuell prüfen.
Eine erste Probe macht man am besten in einem neuen, leeren Dashboard. So lassen sich die Karten experimentieren, ohne das produktive Hauptdashboard zu gefährden.
Schritt 2: Räume mit Mushroom Templates
Mushroom Cards leben von Templates. Der Klassiker ist eine Raum-Übersicht, die Licht, Temperatur und Anwesenheit in einer einzigen Karte zeigt:
type: custom:mushroom-template-card
primary: Wohnzimmer
secondary: >-
{{ states('sensor.wohnzimmer_temperatur') }}°C ·
{{ states('sensor.wohnzimmer_luftfeuchtigkeit') }}%
icon: mdi:sofa
icon_color: >-
{% if is_state('light.wohnzimmer', 'on') %} amber
{% else %} grey {% endif %}
tap_action:
action: navigate
navigation_path: /lovelace/wohnzimmer
hold_action:
action: toggle
entity: light.wohnzimmer
Die Karte zeigt auf einen Blick den Zustand des Raums, ein Tap öffnet die Detail-Ansicht des Raums, langes Drücken schaltet das Licht direkt. Das ist das Muster, das Mushroom so wertvoll macht: jede Karte ist gleichzeitig Informationsanzeige und Steuerung.
Für Lichter, Klima und Medienspieler gibt es spezialisierte Mushroom-Varianten (mushroom-light-card, mushroom-climate-card, mushroom-media-player-card), die schon out-of-the-box vernünftig aussehen.
Schritt 3: Pop-ups und Modals mit Bubble Cards
Was Mushroom nicht macht, sind echte Pop-ups. Hier kommen Bubble Cards ins Spiel. Eine bubble-card vom Typ pop-up blendet ein Modal direkt im aktuellen Dashboard ein – ideal für Raum-Detail-Seiten, ohne dass man eine eigene View bauen muss.
type: custom:bubble-card
card_type: pop-up
hash: "#wohnzimmer"
name: Wohnzimmer
icon: mdi:sofa
button_type: name
modules:
- default
Aufgerufen wird das Pop-up von einer Mushroom-Karte über tap_action: action: navigate, navigation_path: /lovelace/main#wohnzimmer. Im Pop-up landen dann alle Detail-Steuerungen: einzelne Lichter, Szenen-Buttons, Heizungs-Setpoint, Medienspieler. Da das Pop-up Teil derselben View ist, gibt es keinen sichtbaren Navigationswechsel – das fühlt sich an wie eine App, nicht wie eine Webseite.
Bubble Card bringt ausserdem hübsche Spezialkarten mit, etwa horizontal-buttons-stack für die untere Navigation, slider für sanfte Dim-Steuerungen oder die cover-card für Rollläden mit Vorschau.
Schritt 4: Konsistenz mit Theme und Tap-Pattern
Damit das Resultat nicht zum Custom-Card-Karneval wird, lohnen sich zwei Vorgaben für sich selbst. Erstens: ein durchgehendes Theme. Graphite oder Mushroom Themes aus HACS sind eine sichere Wahl und bringen die nötigen CSS-Variablen für beide Card-Familien mit. Zweitens: ein einheitliches Tap-Pattern. Bei mir gilt überall – Tap = primäre Aktion (Hauptlicht oder Hauptszene), Hold = Detail-Pop-up. Wer das durchzieht, muss seinen Mitbewohnern nichts erklären.
Schritt 5: Mobile zuerst, Desktop später
Die meisten Familienmitglieder bedienen Home Assistant auf dem Smartphone. Deshalb sollte das Dashboard mobile-first entworfen werden. In Mushroom und Bubble sind die Defaultgrössen schon auf Touch optimiert. Die einzige Disziplin: maximal sechs Kacheln pro Reihe auf dem Handy, Layout mit grid-layout oder vertical-stack aufbauen, nichts mit fixer Pixelbreite. Die Desktop-Ansicht kommt dann fast geschenkt, weil Browser und Tablet einfach mehr Spalten anzeigen.
Wer ein zweites Tablet im Flur betreibt, profitiert von der kiosk-mode-Integration zusätzlich – sie versteckt Header und Sidebar dauerhaft.
Häufige Stolperfallen
Drei Punkte, an denen viele scheitern. Erstens: Templates greifen auf Entitäten zu, die im Editor zur Designzeit nicht existieren. Wenn eine Karte «leer» bleibt, fehlt meist ein Komma im Jinja-Template – die Karte rendert dann gar nichts. Zweitens: Pop-ups mit hash: brauchen einen eindeutigen Hash pro Dashboard. Doppelte Hashes führen zu seltsamen Sprung-Verhalten. Drittens: Performance. Bei mehr als 30 Mushroom-Karten in einer View lohnt sich layout-card mit gestaffeltem Laden – sonst flackert das Dashboard beim Öffnen.
Fazit
Mushroom und Bubble Cards verwandeln Home Assistant von einem Power-User-Werkzeug in eine UI, die der Rest der Familie freiwillig benutzt. Die Investition ist überschaubar – ein Wochenende für die erste Version, eine weitere Iteration nach zwei Wochen praktischer Nutzung. Wer schon ein produktives HA-Setup hat, sollte als Erstes die Wohnzimmer-Karte umbauen und das neue Muster zwei Wochen testen, bevor das ganze Haus migriert wird. Mehr zur tieferen Anpassung gibt der Artikel zu AI Task in Home Assistant, in dem strukturierte LLM-Antworten in die Dashboards integriert werden.