Code Snippets – Themes selbst erstellen

Themes Ordner über configuration.yaml hinzugügen:

frontend:
  themes: !include_dir_merge_named themes

Generelle Codes für selbst erstellte Themes:

Theme Name:
  # TEXT Farben ######################################

  # Primäre und Sekundäre Textfarben in Karten

  # Entity card:              primary für Entitäs Werte, secondary für Entitätsnamen
  # Most other cards:         primary für Titel, entity Namen and werte
  # History graph:            primary für Titel und entity Namen, secondary für Axenbeschriftung

  primary-text-color: "#e1e1e1"
  secondary-text-color: "#6c8b9b"

  # Text colour on HA buttons

  text-primary-color: "#e1e1e1"                     # z.B. in Entwicklerwerkzeugen
  text-light-primary-color: "#1c1c1c"               # z.B. für den User Profil Button unten rechts
  disabled-text-color: "#bdbdbd"

  # Header text

  app-header-text-color: "#e1e1e1"

  # Badges

  label-badge-text-color: "#e1e1e1"

  # Sidebar

  sidebar-text-color: "#e1e1e1"                     # standardmäßig die primäre Textfarbe
  sidebar-selected-text-color: "#6c8b9b"            # standardmäßig die sekundäre Textfarbe

  # BACKGROUND COLOURS ###############################

  # Main display area

  primary-background-color: "#000000"               # schwarz
  card-background-color: "#000000"                  # schwarz
  # card-background-color: rgba(0,0,0,0)            # transparent
  secondary-background-color: "#585858"             # Hinter Aktueller auswahl im Dropdown

  # Sidebar

  sidebar-background-color: "#1c1c1c"

  # Header

  app-header-background-color: "#0099c7"            # früheres Blau

Beispiel für alte Optik der Titelleiste in Theme File/Ordner

old HA:
  app-header-background-color: "#0099c7"
  app-header-text-color: white

Beispiel für alte Optik der Titelleiste über configuration.yaml

frontend:
  themes:
    oldha:
      app-header-background-color: "#0099c7"
      app-header-text-color: white

• Über
• Letzte Artikel

Thomas Wiesner

Mein Name ist Thomas, ich bin 43 Jahre Alt und interessiere mich seit über 30 Jahren aktiv für alles was mit IT und Technologie zu tun hat. Schon als siebenjähriger habe ich angefangen in Q-Basic zu Programmieren, und diese Leidenschaft führt sich bis Heute mit etlichen Technologien fort. Hauptberuflich arbeite ich als IT System Engineer in einem großen Deutschen IT Unternehmen. Hier in diesem Blog möchte ich euch meine Erfahrungen mit dem Thema Haus- und Sprachsteuerung nahebringen und euch somit etwas Hilfestellung geben.

Letzte Artikel von Thomas Wiesner (Alle anzeigen)

• Code Snippets – Themes selbst erstellen - 5. Februar 2026
• 🎥 Nie wieder Suchen! 🔍 Home Assistant 2026.2 macht alles intuitiver - 1. Februar 2026
• 🎥 Home Assistant Automationen ENDLICH verstehen! 💡 Auslöser & Bedingungen erklärt - 25. Januar 2026