Fast dreitausend Entitäten, sieben Etagen, eine Wärmepumpe mit Pufferspeicher, ein Rack voller Technik. Irgendwann reicht es nicht mehr, in Home Assistant von Ansicht zu Ansicht zu tippen. Ich wollte einen Ort, an dem ich morgens mit dem Kaffee sehe, was los ist, und abends mit einem Blick weiß, ob alles zu ist. Dieser Ort heißt bei mir ITSWEBER Zuhause, läuft auf dem großen Bildschirm im Büro und auf jedem Rechner im Haus, und dieser Artikel zeigt, wie er entstanden ist, was er kann und wie du ihn dir selbst holst.
Es ist der erste von drei Teilen. Der zweite Teil dreht sich um die Handy-App und das Wandtablet im Flur, der dritte um das Küchen-Tablet mit Timer, Klingel und Sprachassistent. Alle vier Dashboards teilen sich ein Theme, eine Logik und einen Download, der am Ende dieses Artikels wartet.
Worum es geht
Home Assistant bringt seit 2024 die Sektionen-Dashboards mit, und die sind gut. Mein Problem war nie die Technik, sondern die Menge. Wer 28 Bereiche, sieben Etagen und ein paar hundert Leuchten, Sensoren und Schalter hat, baut sich in der Oberfläche entweder eine Wand aus Kacheln oder er fängt an, sich Regeln zu geben. Ich habe mich für die Regeln entschieden.
- Eine Startseite, die einen Satz sagt. Nicht dreißig Werte, sondern die Lage. „Alles ruhig, Fenster und Türen sind zu, sieben Lichter brennen.“ Der Satz kommt nicht vom Dashboard, sondern von einem Sensor, der für alle Dashboards rechnet.
- Warnungen nur, wenn es welche gibt. Eine Karte für die Pufferfühler erscheint, wenn der ESP im Heizkeller schweigt. Sonst ist sie nicht da.
- Räume aus der Registry. Kein Raum wird von Hand gebaut. Was in Home Assistant einem Bereich zugeordnet ist, landet in der passenden Etage, mit Bedienung, Messwerten und Verlauf.
- Farben nur aus dem Theme. Die Karten holen jede Farbe aus Variablen. Hell und Dunkel sind zwei Blöcke in einer YAML-Datei, eine zweite Farbwelt ist einfach eine zweite Datei.
- Lebende Untertitel. Jede Verweiskarte sagt, was dahinter gerade los ist. „1 von 4 Lichtern an“, „Kevag aktiv, Starlink aktiv, 94 Geräte“, „E10 ab 2,349 €“.
So ist es aufgebaut
Links sitzt eine schmale Leiste mit fünf Punkten, oben die Mindmap aus meinem Logo, weiß auf Dunkelblau wie im Kopf dieser Webseite. Zuhause, Räume, Heizung, Kameras, Mehr. Auf schmalen Bildschirmen wandert die Leiste nach unten, und der erste Punkt führt zurück in die Handy-App. Der Rest der Seite besteht aus drei Spalten mit Sektionen, jede Sektion hat eine Überschrift und rechts daneben eine kleine Notiz, etwa das Datum oder „Haus & Technik“.
Die Karten selbst sind fast alle Button-Cards mit vier Vorlagen. Eine Verweiskarte mit Symbol, Name, lebendem Untertitel und Pfeil. Eine Kennzahlkarte mit großem Wert. Eine Textkarte für Sätze. Eine Zeilenkarte, die eine Liste aus Beschriftung und Wert zeigt und die Zustände von Home Assistant ins Deutsche übersetzt, Türkontakt „Zu“, Bewegungsmelder „Ruhig“, Schloss „Verriegelt“. Dazu kommen native Kacheln für Licht und Rollläden, eine Wetterkarte, Verlaufskarten und die eigene Heizungskarte, zu der wir gleich kommen.
Der Haus-Check
Der wichtigste Baustein steht nicht im Dashboard, sondern in einem Paket in Home Assistant. Ein Template-Sensor namens sensor.haus_check rechnet jede Minute und bei jedem Türkontakt, Rauchmelder oder Wärmepumpenfehler die Lage aus. Er liefert einen Zustand von „ok“ bis „alarm“, einen deutschen Satz, eine Liste mit Punkten für die Familie und eine zweite Liste mit Wartungspunkten für mich. Offene Fenster bei Regen sind eine Warnung, offene Fenster bei Sonne ein Hinweis, Licht im leeren Haus ein Hinweis, ein Rauchmelder ein Alarm.
Alle vier Dashboards lesen nur diesen Sensor. Ein Sensor rechnet, vier Oberflächen zeigen. Das hält die Tablets schnell, weil kein Browser mehr über tausende Zustände laufen muss, und es sorgt dafür, dass Handy, Küche, Flur und Desktop dieselben Worte benutzen.
Räume, die sich selbst bauen
Die Raumansichten sind der Teil, den ich am wenigsten angefasst habe und der am meisten kann. Der Generator liest die Bereiche und Etagen aus Home Assistant, sammelt je Bereich alles, was sich bedienen lässt, dazu Temperatur, Luftfeuchte und Kontakte, und baut daraus eine Übersicht nach Etagen plus eine Unteransicht je Raum. Neuer Raum in Home Assistant, neuer Raum im Dashboard.
Das Label-Prinzip
Bei rund 120 Leuchten zählt nicht jede. Status-LEDs von Access Points, Switches und Sprachassistenten sind in Home Assistant auch Lichter, und die will niemand auf einem Dashboard. Ich vergebe deshalb in Home Assistant zwei Labels. show_dboard heißt, die Leuchte gehört aufs Dashboard, no_dboard blendet Rollläden und Schalter aus, die nur der Automatik dienen. Der Generator, der Haus-Check und alle Karten lesen diese Labels. Wer neu anfängt und noch kein Label gesetzt hat, bekommt alle Leuchten, so lange, bis das erste Label vergeben ist.
Die Heizung als eigene Karte
Meine Heizung ist eine LG Therma V Wärmepumpe mit einem 500-Liter-Pufferspeicher, einem Warmwasserspeicher, zwei Heizkreisen mit Shelly-geschalteten Pumpen und einem Ölkessel als Notbetrieb. Home Assistant spricht per Modbus mit der LG. Das ist zu viel für Kacheln, deshalb ist die Heizung eine einzige Karte, die ich von Grund auf gebaut habe. Sie sieht aus wie ein moderner Raumthermostat und zeigt das, was ich am Regler im Keller sehen würde, nur verständlich.
Die Karte hat fünf Reiter. Anlage, Warmwasser, Verlauf, Energie und Heizkurve. Was sich schreiben lässt, fragt vorher nach und sagt dabei, welches Modbus-Register es setzt. Der Drehregler für den Vorlauf gilt nur im Handbetrieb, in der Betriebsart „Auto AI“ rechnet die LG selbst nach ihrer Heizkurve, und der Regler verschiebt die Kurve um bis zu fünf Grad. Seit dem 26. September schaltet zusätzlich eine Heizgrenze-Automatik die beiden Heizkreise und das Heizen an der Wärmepumpe nach Außentemperatur im Schatten, mit Mindestlaufzeit und einem Textfeld, das im Dashboard erklärt, warum eine Pumpe gerade läuft.
Was die Heizungskarte technisch ist
Eine Custom Card aus acht Quelldateien, die ein Build-Skript zu einer Datei zusammensetzt und als Ressource in Home Assistant einträgt. Das Schema ist SVG, die Leitungen sind Pfade mit animiertem Strichmuster, die Ringe und Regler eigene Elemente. Werte holt die Karte aus dem Zustand von Home Assistant, Verläufe und Energie aus der Statistik-Datenbank per WebSocket. Während einer Berührung wird nicht neu gezeichnet, sonst reißt die Companion App die Wischgeste ab. Alle Entitäten stehen in der Dashboard-YAML, nicht im Code. Fehlt eine, zeigt die Karte einen Platzhalter und sagt das auch.
Kameras, Sicherheit, Personen, Netzwerk, System
Unter „Mehr“ liegt alles, was nicht täglich nötig ist, aber da sein muss, wenn man es braucht. Die Kameraansicht zeigt fünf UniFi-Kameras mit sauberen Namen, darunter das Zutrittsprotokoll mit Bild. Wer die Haustür öffnet, landet dort mit Foto, Methode und Uhrzeit, per Gesichtserkennung mit Name. Ein Klick auf die Zeile öffnet das Bild groß.
Die Netzwerkseite hat mich am meisten Nachdenken gekostet. UniFi liefert keinen sauberen Ist-Zustand der Leitung, sondern ein Protokoll aus Latenz-Warnungen und kurzen Aussetzern. Auf dem Dashboard steht deshalb nicht „Störung“, sondern „2 kurze Aussetzer, 1 mal Latenz“, mit dem Hinweis, dass ein Eintrag keine aktuelle Störung bedeutet. Ehrliche Daten sind besser als eine rote Lampe, die niemand einordnen kann.
Wie es entstanden ist
Ich habe das Dashboard nicht zusammengeklickt. Ich habe zuerst eine Gestaltung abgenommen und dann einen Generator schreiben lassen, der daraus die Konfiguration baut. Beides mit KI, und ich will das genau so sagen, wie es war.
Die Gestaltung stammt aus einer HTML-Review, die im September mit ChatGPT entstanden ist. Drei Farbwelten, drei Gerätegrößen, fünfzehn Ansichten, alles anklickbar, alles mit echten Beispieldaten aus meinem Haus. Daran habe ich Salbei als Farbwelt, die linke Leiste und den dreispaltigen Aufbau festgelegt. Vorher hatte ich zwei Anläufe mit Claude verworfen, einen mit eigenem Design ohne Abnahme, einen als Nachbau meiner alten Handschrift. Die Lehre daraus ist meine wichtigste Regel geworden. Erst eine Vorlage zum Anfassen, dann die Freigabe, dann erst das System.
Kurz vor der Veröffentlichung kam trotzdem noch einmal die Farbfrage auf, denn Salbei passte zum Haus, aber nicht zu dieser Webseite. Also dasselbe Spiel wie bei der Review. Alle Ansichten zweimal fotografiert, einmal in Salbei und einmal in den Farben von itsweber.de, nebeneinander auf einer Seite. Gewonnen hat Teal mit weißen Karten, dunkelblauen Leisten und kleinen Zeilen in Schreibmaschinenschrift. Salbei ist nicht verschwunden. Beide Farbwelten stecken im Download, der Assistent fragt, welche du haben willst, und umstellen kannst du später jederzeit.
Der Generator, die Heizungskarte, der Haus-Check und alles, was danach kam, sind mit Claude Code entstanden. Der Generator ist ein Node-Skript, das die Registry und die Zustände aus Home Assistant liest, die Ansichten zusammensetzt, die Konfiguration per WebSocket speichert und zur Kontrolle wieder zurückliest. Ein zweites Skript öffnet danach alle 37 Ansichten in einem echten Browser bei 1440 und bei 375 Pixeln, sucht nach Fehlerkarten, JavaScript-Fehlern und Überlauf und legt Screenshots ab. Erst wenn das ohne Befund durchläuft, ist ein Umbau fertig.
Kann man es trotzdem in Home Assistant bearbeiten?
Ja, und das ist die ehrliche Antwort mit einem Aber. Das Desktop-Dashboard besteht aus normalen Sektionen mit normalen Karten. Du kannst es mit dem Stift öffnen, Karten verschieben, Texte ändern, alles speichern. Nur ist der Generator dann nicht mehr die Wahrheit, und beim nächsten Lauf sind deine Änderungen weg. Deshalb gilt bei mir die Regel, dass Änderungen am Desktop im Generator passieren. Die Heizungskarte und die drei Karten der anderen beiden Teile haben dagegen einen eigenen Editor mit echten Entitäts-Pickern, dort ist der Dashboard-Editor der richtige Weg.
Und wie kommst du an das Dashboard?
Ein Dashboard mit 390 Entitäten aus meinem Haus nützt dir nichts, wenn du es einfach kopierst. Es würde nur Fehlerkarten zeigen. Deshalb habe ich den Generator in eine Fassung übersetzt, die im Browser läuft, und drumherum einen Assistenten gebaut. Der Assistent verbindet sich mit deinem Home Assistant, liest deine Bereiche, Etagen, Personen und Geräte und baut daraus dein eigenes ITSWEBER Zuhause. Räume, Licht, Personen, Sicherheit, Energie und System entstehen aus deiner Registry, Wetter, Schloss, Kameras und Heizung ordnest du zu, alles andere lässt er weg, statt leere Stellen zu zeigen.
Der Assistent ist eine einzelne HTML-Datei ohne Server. Du öffnest sie lokal, trägst die Adresse deiner Instanz und einen langlebigen Token ein, und alles bleibt in deinem Netz. Er legt nichts an, ohne es vorher zu sichern, und er schaltet nichts. Getestet habe ich ihn in meinem eigenen System und in einer frischen Home-Assistant-Instanz in einem Container, in der nur die Demo-Integration lief.
| Im Paket | Was es ist |
|---|---|
| assistent.html | Der Einrichtungsassistent, sechs Schritte, läuft im Browser |
| www/iw-heizung, iw-mobile, iw-flur, iw-tablet | Die vier Karten als fertige Dateien, dazu Schrift und Töne |
| www/iw-brand | Die Mindmap als Maske, die das Theme einfärbt |
| themes/itsweber_teal.yaml, itsweber_salbei.yaml | Die zwei Farbwelten, jede mit Hell- und Dunkelmodus |
| packages/itsweber_dashboards.beispiel.yaml | Beispiel für das Paket, das der Assistent für dich passend schreibt |
| LIESMICH.md | Voraussetzungen und die fünf Schritte |
Voraussetzungen. Home Assistant 2025 oder neuer, aus HACS die Karten Button Card, Navbar Card, Expander Card, Mini Graph Card, Stack In Card, Card-mod und Kiosk Mode, ein Administrator-Token. Das Kopieren der Dateien nach /config/www und /config/themes bleibt Handarbeit, alles danach macht der Assistent. Die ausführliche Anleitung mit Bildern zu jedem Schritt steht im Wiki.
Woran ich noch arbeite
Ein Dashboard, das die Wahrheit zeigt, zeigt auch die Baustellen. Auf der Startseite steht seit Wochen, dass die Steuerung des Serverracks nicht erreichbar ist, weil der ESP dafür ausgesteckt auf dem Schreibtisch liegt. Die Xsense-Rauchmelder melden sich seit einem Update der Cloud-Integration nicht mehr, das steht als „47 Rauchmelder ohne Rückmeldung“ in der Technik-Karte, obwohl die Melder selbst funktionieren. Die Cupra-Integration wartet auf eine Zustimmung zu neuen Bedingungen, die ich in der App noch nicht gegeben habe. Und die Alarmanlage ist eingerichtet, aber nie scharf geschaltet worden, weil die Sensoren dafür noch nicht vollständig sind.
Ich könnte das alles für die Screenshots verstecken. Ich lasse es drin, weil genau das der Punkt eines solchen Dashboards ist. Es erinnert mich jeden Morgen daran.
Was es mir gebracht hat
Ich schaue nicht mehr nach, ich lese. Ein Satz oben rechts sagt mir, ob ich mich um etwas kümmern muss. Die Räume pflegen sich selbst. Die Heizung verstehe ich zum ersten Mal auf einen Blick, mit Puffer, Warmwasser und Kurve. Und weil Farben und Logik an einer Stelle liegen, kann ich das Ganze in einer Stunde umbauen, ohne dass etwas auseinanderfällt.
Der Preis ist Disziplin. Wer den Generator hat, klickt nicht mehr im Editor. Wer Labels nutzt, setzt sie auch bei jeder neuen Leuchte. Das ist der Deal, und für mich geht er auf.
ITSWEBER Dashboards herunterladen
Assistent, vier Karten, zwei Themes und Paket in einem ZIP. Kostenlos für den privaten Einsatz, ohne Konto, ohne Telemetrie. Für Fragen gibt es die Kommentare und das Kontaktformular.
Zum Download Fragen stellenAlle Screenshots stammen aus meinem laufenden System vom 26. September 2026 mit Home Assistant 2026.9.3. Gesichter, Kamerabilder, Entfernungen und Aufenthaltsorte sind verpixelt, sonst ist nichts nachbearbeitet. Das Dashboard wurde mit Claude Code gebaut, die Gestaltungsvorlage entstand mit ChatGPT, die Entscheidungen, die Abnahmen und die Fehler dazwischen sind meine.
