Ein kleines Touch-Display neben der Haustür, in der Küche oder auf dem Schreibtisch – mit Licht, Rollläden, Temperatur, Poolwerten oder Musik, direkt aus Home Assistant. Das „Cheap Yellow Display“ kann das seit Langem. Nur: Wer es selbst einrichten wollte, musste hunderte Zeilen ESPHome-YAML schreiben, Koordinaten ausprobieren, flashen, nachbessern und wieder flashen.
Deshalb habe ich CYD Studio gebaut: einen Designer in Home Assistant, in dem du dein Display per Klick und Drag & Drop zusammenstellst, eine pixelgenaue Vorschau mit echten Werten siehst – und am Ende fertigen ESPHome-Code bekommst. Ohne eine einzige Zeile YAML. Kostenlos und Open Source.
Was ist CYD Studio?
CYD Studio ist eine Integration für Home Assistant, die du über HACS installierst. Sie bringt einen eigenen Menüpunkt in die Seitenleiste. Dort gestaltest du ein Dashboard für das ESP32-2432S028R – das „Cheap Yellow Display“ mit 2,8-Zoll-Touchscreen (320 × 240 Pixel) und eingebautem WLAN.
- Zusammenklicken statt programmieren: Widgets aufs Display ziehen, mit Entitäten verbinden, fertig.
- Sehen, was rauskommt: Die Vorschau nutzt dieselbe Layout-Berechnung, dieselben Schriften und Farben wie das Display – und zeigt deine echten Zustände aus Home Assistant.
- Fertiger Code: Ein Klick, und die Konfiguration liegt in ESPHome. Du musst sie nur noch aufspielen.
- Komplett lokal: keine Cloud, kein Konto, kein Abo. Oberfläche auf Deutsch und Englisch.
Was CYD Studio kann
Editor & Vorschau
Bearbeiten- und Vorschau-Modus, Rückgängig/Wiederholen, Zoom und eine Widget-Liste mit Suche. In der Vorschau kannst du tippen und wischen wie auf dem Gerät, mit „Live-Daten“ siehst du die echten Werte, mit „Nacht“ den gedimmten Nachtmodus. Die Vorschau lässt sich auch als PNG speichern – praktisch zum Zeigen.
24 Widgets
- Kacheln: Schalter-Kachel (Tippen schaltet, langes Drücken öffnet bei Lampen ein Popup mit Helligkeit, Farbtemperatur und Farbe), Messwert, Status-Anzeige (z. B. Fenster offen/zu), Person, Mehrfachwert (bis zu drei Werte in einer Kachel).
- Steuerung: Rollladen, Klima (Soll −/+, Ist-Wert, Modus), Regler, Zahlen-Stepper, Auswahl, Media-Player, Szenen-Button, Button-Raster.
- Anzeige: Uhr mit Datum, Wetter, Gauge (z. B. Akku-Ladestand), Countdown mit Fortschrittsbalken, Nachrichtenbereich, QR-Code, Text.
- Navigation & Layout: Seiten-Button, Seitentitel, Trennlinie, Abstand.
Seiten & Navigation
Beliebig viele Seiten, Unterseiten mit Zurück-Navigation, eine Tab-Leiste, Wischen zwischen den Seiten, eine globale Kopfzeile, Popups und die automatische Rückkehr zur Startseite. Mein Display hat zum Beispiel die Seiten PV, Start, Küche und Pool.
Gestaltung
Fünf Themes (mastershort dark, Hell, Kontrast, OLED-Schwarz, Home im iOS-Stil) und fünf Kachel-Stile (Karte, Flach, Umriss, Glas, Kräftig). Pro Widget stellst du Farben für an und aus ein, Deckkraft, Ecken, Rahmen, Icon im Kreis, Icon- und Textgröße. Beschriftungen lassen sich ausblenden – praktisch, wenn in einer Raumkarte klar ist, welches Licht gemeint ist; das Layout rückt dann nach. Regler, Gauges und Balken bekommen eigene Farben, und jede Seite kann ein eigenes Hintergrundbild haben, das automatisch auf die Displaygröße zugeschnitten wird. Einen gelungenen Stil wendest du mit einem Klick auf die ganze Seite an oder speicherst ihn als Projekt-Standard.
Logik
- Eigene Aktionen für Tippen, langes Drücken und Doppeltippen: schalten, beliebige Home-Assistant-Aktion, Seite öffnen, zurück, Startseite, Popup, warten.
- Bedingungen: ein Widget nur anzeigen, wenn etwas zutrifft.
- Zustandsregeln: z. B. eine Kachel rot färben, wenn es über 25 °C sind.
- Nachtmodus und Bildschirmschoner.
- Das Display aus Automationen steuern: Seite anzeigen, Nachricht einblenden, aufwecken, dimmen, Helligkeit setzen, RGB-LED schalten.
Mehrere Displays
Jedes Display ist ein eigenes Projekt mit Mini-Vorschau und Verbindungsstatus. Projekte lassen sich duplizieren, als Datei sichern und wieder importieren (inklusive Hintergrundbildern – der API-Schlüssel wird nie mitexportiert). Mein Lieblingsfeature: „Design übernehmen“. Damit überträgst du das komplette Design eines Displays auf ein anderes. Name, Gerätename, API-Schlüssel und WLAN des Ziels bleiben erhalten – das zweite Display muss also nicht neu in Home Assistant eingerichtet werden. Und falls es doch nicht passt: direkt rückgängig machen.
Qualität: Der erzeugte Code wird bei jeder Änderung an CYD Studio automatisch mit ESPHome 2026.9 geprüft und kompiliert.
Was brauche ich?
| Was | Wo | Hinweis |
|---|---|---|
| ESP32-2432S028R (CYD 2,8″) | AliExpress | günstig, 2–3 Wochen Lieferzeit, liefert weltweit – Variante mit Touch wählen |
| ESP32-2432S028R (CYD 2,8″) | Amazon.de | schnell in Deutschland/EU |
| USB-Netzteil 5 V | Amazon.de | jedes Handy-Netzteil geht |
| Gehäuse zum Selbstdrucken | MakerWorld (kostenlos) | CC0-Design von akuehlewind |
Affiliate-Links: Als Amazon-Partner und AliExpress-Partner verdiene ich an qualifizierten Verkäufen. Für dich ändert sich der Preis nicht.
- Fürs erste Aufspielen brauchst du ein USB-Datenkabel (kein reines Ladekabel). Unter Windows eventuell den CH340-Treiber installieren.
- Unterstützt und getestet ist das ESP32-2432S028R mit den Display-Varianten ILI9341, ST7789 und ILI9342 – das „R“ steht für den resistiven Touch. Die kapazitive Variante (…028C) sowie die 3,5- und 4,3-Zoll-Boards sind geplant, aber noch nicht unterstützt.
- Fertig gedruckte Gehäuse gibt es bald hier auf mastershort.de.
Alles auf einer Seite, auch für Leser außerhalb Deutschlands: mastershort.de/cyd-studio/hardware
Installation Schritt für Schritt
- Installieren über HACS: Diesen Link öffnen – er öffnet CYD Studio direkt in deinem HACS. Falls CYD Studio in HACS noch nicht über die Suche auftaucht: HACS → ⋮ → „Benutzerdefinierte Repositories“ →
https://github.com/Mastershort/cyd-studiomit Typ Integration hinzufügen. Dann „CYD Studio“ herunterladen und Home Assistant neu starten. - Integration hinzufügen: Einstellungen → Geräte & Dienste → „Integration hinzufügen“ → „CYD Studio“. In der Seitenleiste erscheint CYD Studio.
- Neues Projekt: Board wählen, Ausrichtung (quer oder hoch), Vorlage – „Leer“ oder „Raum-Panel“ mit Uhr, Temperatur, zwei Lichtern und einer Szene. Bei der Vorlage ordnest du gleich die passenden Entitäten zu.
- Gestalten: Widgets per Klick oder Drag & Drop aufs Display legen und mit Entitäten verbinden. Die Suche zeigt Bereich und aktuellen Zustand.
- Code erzeugen → „In ESPHome speichern“: CYD Studio legt die Datei direkt im ESPHome-Ordner an und trägt die WLAN-Zugangsdaten in die ESPHome-Secrets ein. Alternativ kopierst oder lädst du den Code herunter.
- Aufspielen: In ESPHome auf „Installieren“. Beim ersten Mal per USB-Kabel („Plug into this computer“, in Chrome oder Edge), danach drahtlos.
Updates: HACS bietet neue Versionen automatisch an. Nach einem Update Home Assistant neu starten und die Seite einmal mit Strg+F5 neu laden. Deine Projekte bleiben erhalten. Änderst du ein Design, zeigt die Projektliste „geändert seit letztem Export“ – dann einfach neu speichern und aufspielen.
Ideen zum Nachbauen
- Raum-Panel pro Zimmer: Licht, Temperatur, Luftfeuchte – mit „Design übernehmen“ in jedem Raum im gleichen Look.
- Küchen-Display: Lichter für Koch- und Essbereich, Rollladen auf/stopp/ab und ein Countdown für Spül- oder Waschmaschine.
- PV & Akku: Gauges für den Ladestand, Messwerte für Erzeugung und Verbrauch.
- Wohnzimmer: Media-Player mit Titel, Lautstärke und Play/Pause.
- Flur: Gast-WLAN als QR-Code, dazu Status der Fenster und Türen.
- Nachrichten per Automation: „Waschmaschine fertig“ oder „Paket ist da“ direkt aufs Display.
Häufige Fragen
Muss ich ESPHome oder YAML können? Nein. ESPHome brauchst du nur zum Aufspielen, den Code erzeugt CYD Studio.
Muss ich löten? Nein. Das Display bekommt Strom über USB und wird beim ersten Mal per USB bespielt.
Schalter reagieren nicht oder Werte fehlen? Fast immer fehlt die Freigabe „Dem Gerät erlauben, Home-Assistant-Aktionen auszuführen“ (siehe Kasten oben).
Kann ich mehrere Displays nutzen? Ja. Jedes Display ist ein eigenes Projekt, und Designs lassen sich übertragen.
Kostet das etwas? Nein. CYD Studio ist kostenlos und Open Source und bleibt es.
Läuft das ohne Internet? Ja, alles läuft lokal zwischen Home Assistant und dem Display.
Ausprobieren & mitmachen
Probier es aus und zeig mir dein Dashboard! Feedback, Fehler und Wünsche am liebsten als Issue auf GitHub oder unten in den Kommentaren. Welche Widgets fehlen dir noch, welches Board soll als Nächstes kommen? Screenshots deiner Displays sind ausdrücklich erwünscht.
CYD Studio unterstützen
CYD Studio ist kostenlos und Open Source – und bleibt es. Wenn es dir Zeit spart, freue ich mich über Unterstützung:
- ☕ Spende per PayPal (auch ohne PayPal-Konto per Karte) – oder alle Wege auf der Unterstützen-Seite
- 🛒 Hardware über die Links oben kaufen – kostet dich nichts extra
- ⭐ Ein Stern auf GitHub hilft anderen, CYD Studio zu finden
Danke
Die Hardware-Grundkonfiguration und das Bedienkonzept basieren auf dem Projekt ESPHome-touch-display-mount von Adrian Kuehlewind (akuehlewind) (MIT-Lizenz). Von ihm stammt auch das freie Gehäuse, in dem mein Display auf dem Foto steckt. Danke dafür!
Mehr zum Board selbst – Flashen, Pins, Fehlerbehebung – steht in meinem Guide Wand-Dashboard für 20 € mit dem Cheap Yellow Display.
