Jak zbudować home assistant dashboard? Układ, widoki i najlepsze karty

Autor: [Twoje Imię lub Pseudonim] | Data: maj 2026

Home Assistant (HA) to potężna, otwartoźródłowa platforma do automatyzacji inteligentnego domu, która pozwala na centralne zarządzanie wszystkimi urządzeniami IoT. Jedną z jej największych zalet są dashboardy – w pełni konfigurowalne panele użytkownika oparte na Lovelace UI. Dzięki nim możesz stworzyć intuicyjny interfejs, który wyświetla stan urządzeń, wykresy zużycia energii, kamery czy sterowanie światłem – wszystko w nowoczesnym, responsywnym designie.

W tym rozbudowanym poradniku krok po kroku pokażemy, jak zbudować dashboard od zera. Omówimy układy, widoki, najlepsze karty, nowe funkcje z wersji 2024.3+ (jak sekcje i eksperymentalne dashboardy obszarowe) oraz triki na mobilne i desktopowe widoki. Bez względu na to, czy dopiero zaczynasz, czy jesteś zaawansowanym użytkownikiem, ten przewodnik pomoże Ci stworzyć panel marzeń. Zaczynamy!

1. Wstęp do dashboardów w Home Assistant – co to Lovelace UI?

Dashboardy w HA to graficzny kokpit, w którym wizualizujesz dane z encji (np. lampy, sensory, termostaty). Domyślny dashboard pokazuje „Wszystko”, ale prawdziwa moc tkwi w niestandardowych dashboardach. Lovelace UI pozwala na:

• drag & drop edycję wizualną (bez kodowania YAML),
• responsywność – automatyczne dostosowanie do telefonów, tabletów i komputerów,
• tysiące kart z HACS (Home Assistant Community Store) dla zaawansowanych wizualizacji,
• tematy i ikony – personalizację wyglądu.

Aby zacząć, upewnij się, że masz zainstalowany Home Assistant (np. na Raspberry Pi, Dockerze czy HA OS). Wejdź w Ustawienia > Dashboardy > Dodaj dashboard i postępuj zgodnie z kreatorem.

2. Tworzenie pierwszego dashboardu – krok po kroku

Krok 1 – dodaj nowy dashboard

Wykonaj poniższe kroki, aby utworzyć nowy panel i nadać mu podstawową strukturę:

1. Przejdź do Ustawienia > Dashboardy > Dodaj dashboard.
2. Wybierz typ spośród poniższych opcji:

• nowy dashboard od podstaw – pusty, dla pełnej swobody,
• domyślny dashboard – wszystkie encje w jednym miejscu,
• mapa – lokalizacja urządzeń na mapie,
• strona internetowa – osadź stronę (np. pogodę),
• obszary (eksperymentalne, od 2024.x) – automatycznie grupuje encje po pokojach.

Wpisz nazwę (np. „Główny”), wybierz ikony (z Material Design), ustaw URL i widoczność (np. tylko dla adminów, w pasku bocznym).

Kliknij „Utwórz” – masz pusty canvas gotowy do działania!

Krok 2 – edycja dashboardu

Aby rozpocząć konfigurację, kliknij Edytuj dashboard (ikona ołówka), a następnie korzystaj z trybu wizualnego; jeśli preferujesz ręczną konfigurację, przełącz się na Raw config (YAML). Pro tip – włącz Zaawansowane tryby w profilu użytkownika, aby odblokować HACS i karty niestandardowe.

3. Układ dashboardu – sekcje, siatki i responsywność

Od wersji 2024.3 wprowadzono sekcje – rewolucyjny drag & drop, który radykalnie upraszcza budowę i porządkowanie paneli. Zamiast przypadkowego rozmieszczania kart, organizuj je w logiczne sekcje, jak na nowoczesnych stronach internetowych.

Podstawowy układ

Proponowany szkielet, który łatwo skalować wraz z rozwojem systemu:

• nagłówek – logo HA, powitanie, szybkie akcje,
• sekcje horyzontalne/wertykalne – grupuj po tematach (np. „oświetlenie”, „energia”, „kamery”),
• grid – automatyczne rozmieszczenie kart w siatce.

Aby dodać sekcję i uporządkować karty, zastosuj te kroki:

1. W edytorze kliknij + > Utwórz sekcję.
2. Wybierz typ: horyzontalna, wertykalna lub grid.
3. Dodaj nagłówek (może zawierać encję, np. „Produkcja PV: {{ states(’sensor.pv_power’) }} W”).
4. Przeciągnij wybrane karty do nowej sekcji.

Poniżej przykładowy układ dla domu, który dobrze działa na desktopie i mobile:

Nagłówek: Godzina + Pogoda
Sekcja 1 (Grid): Salon – światło, TV, temperatura
Sekcja 2 (Horyzontalna): Energia – PV, zużycie, bateria
Sekcja 3 (Wertykalna): Kamery – podgląd live
Sekcja 4 (Mobilna): Sterowanie – przyciski one-tap

Dla mobilnych widoków użyj dodatku card-mod z HACS, aby karty elegancko układały się pionowo na małych ekranach i zachowały czytelność.

4. Najlepsze karty do dashboardu – top wybory

Poniższa tabela podsumowuje popularne karty (2026) wraz z zastosowaniami oraz sposobem instalacji, aby szybko wybrać odpowiednie komponenty:

Karta	Zastosowanie	Instalacja	Przykład
Button Card (HACS)	Stylowe przyciski z ikonami i kolorami zależnymi od stanu.	HACS > Frontend	type: custom:button-card entity: light.salon
Mushroom Cards (HACS)	Minimalistyczne i mobilne (chips, title, light).	HACS	Chips dla temperatur.
Mini Graph Card (HACS)	Kompaktowe wykresy (energia, temperatura).	HACS	hours_to_show: 24
History Graph	Pełne wykresy historyczne.	Wbudowana	entities: [sensor.temp, sensor.humidity]
Picture Elements	Interaktywna mapa pokoju (aktywny overlay encji).	Wbudowana	Obraz planu pomieszczenia z elementami sterującymi.
Gauge / Apex Charts (HACS)	Okrągłe wskaźniki i zaawansowane wykresy.	HACS	Wskaźnik produkcji PV.
Conditional Card	Ukrywanie/pokazywanie kart na podstawie warunków (np. nocą).	Wbudowana	conditions: state: input_boolean.night_mode
Webpage Card	Osadzanie widoków (np. Frigate dla kamer).	Wbudowana	url: /frigate

Aby zainstalować HACS, dodaj HACS przez Sklep dodatków, uruchom i połącz z GitHub, a następnie wyszukaj i zainstaluj potrzebne karty w sekcji Frontend.

Dla szybkiego startu z przyciskami energii skorzystaj z poniższego przykładu YAML:

type: custom:button-card
entity: sensor.pv_production
name: PV
icon: mdi:solar-power
show_state: true
state:
- value: '0'
color: red
- above: '100'
color: green

5. Widoki zaawansowane – tematyka, automatyzacja i optymalizacja

Dashboardy tematyczne

Aby szybciej budować spójne panele, wykorzystaj widoki wokół konkretnych potrzeb:

• Energia – sekcja z Apex Charts (produkcja PV, zużycie, bateria); użyj energy_dashboard do natywnej integracji;
• Bezpieczeństwo – podgląd kamer + sensory ruchu (Frigate + binary_sensor);
• Klimat – termostaty z wykresami temperatury i wilgotności (Thermostat Card);
• Areas Dashboard – automatyczne grupowanie encji według pomieszczeń bez dodatkowej konfiguracji.

Responsywność i motywy

Dopasuj wygląd do urządzenia i preferencji użytkowników:

• Motywy – ustawienia > motywy (np. dark mode); per karta możesz użyć theme: dark;
• Ikony i nazwy – nadpisuj w konfiguracji kart: name: Salon, icon: mdi:sofa;
• Widoki – utwórz oddzielne panele „Mobilny” i „Desktop” i przełączaj je w zależności od urządzenia.

Automatyzacja dashboardu – automatycznie przełączaj widoki za pomocą input_select lub reguł w automatyzacjach; w razie potrzeby korzystaj z trybów interfejsu (np. lovelace-mode) do dynamicznych zmian.

6. Triki pro – integracje i customizacje (2026 update)

Poniższe wskazówki przyspieszą pracę i ułatwią tworzenie dopracowanych paneli:

• Shelly i Zigbee – dedykowane karty dla urządzeń (np. Shelly 3EM dla energii);
• Frigate NVR – widok na żywo w Picture Glance lub Webpage Card;
• Osadzone strony – dashboard jako iframe dla narzędzi (np. IKEA Tradfri);
• Sekcje 2024.3+ – szybkie drag & drop, idealne na urządzenia mobilne;
• Inspiracje z community – fora i blogi (np. arturhome.pl, zgranydom.pl) z gotowymi fragmentami YAML.

Wydajność – ogranicz liczbę encji na widoku i korzystaj z group, aby redukować obciążenie interfejsu.

7. Błędy początkujących i jak ich uniknąć

Sprawdź najczęstsze pułapki i proste sposoby, by ich uniknąć:

• Zbyt wiele kart – porządkuj treści w sekcjach i gridzie;
• Brak responsywności – regularnie testuj panel na telefonie i tablecie;
• Brak HACS – rezygnujesz z większości najlepszych kart i rozszerzeń;
• Błędy YAML – zawsze waliduj składnię w edytorze przed zapisaniem.

Polecane zasoby

Jeśli chcesz poszerzyć wiedzę, sprawdź poniższe materiały:

• oficjalna dokumentacja – home-assistant.io/dashboards,
• youtube: „Poradnik dla początkujących” i „Sekcje 2024.3”,
• playlisty: „Dashboardy HA”,
• blogi: Botland oraz ZgranyDom.

Artykuł oparty na Home Assistant 2026.x; niektóre aktualizacje mogą wymagać restartu systemu.