Features

Features

Layout & editing

• Multiple views/pages with a left Sidebar + RoomNav.
• Edit mode — drag-and-drop tiles (@dnd-kit), add/remove tiles, add/reorder/ remove scenes per view, reset to defaults. Saved to layouts.json (syncs across devices on the same host; persists to /data on the add-on).
• Per-tile settings (TileSettings) — camera entity, links, quick actions, flyout config, reverse slider, custom artwork entity, tile size/span.
• Tile sizes — by default tiles are compact 1x1; vacuums and covers (with a current_position attribute) auto-pick a tall 1x2 to fit their controls. Light tiles stay 1x1 even when on (the brightness slider works across the compact tile) so toggling a light doesn't reflow the grid. You can override any tile's size in TileSettings (1x1, 2x1, 1x2, 2x2) — those manual choices are always preserved on the auto-sized defaults.
• Gap-filling layout — the tile grid uses grid-auto-flow: dense, so 1x1 tiles backfill empty space left by taller (1x2) tiles instead of leaving holes.
• Compact sections (Settings → Appearance, on by default) — flows whole room sections into a responsive masonry so short sections sit side-by-side and fill the screen width instead of each claiming a full-width band with a tall empty gap. Section headings and separation stay intact; column count scales with the viewport (1 → 4). Turn it off to stack every section full-width.
• Header layout — the People avatars live in the header's top-right in their own glass bubble, level with the weather widget. Scenes render in a card at the bottom of the page so the room tiles appear sooner without scrolling.
• Layout export / import (Settings → Dashboard data) — see Layout: Backup & Restore.

Tiles & cards

• DeviceTile — lights, switches, media players, covers, locks, buttons, etc. with slide-to-dim, live artwork backgrounds, and per-domain controls.
• ClimateCards, LockCards, VacuumCard, CameraGrid, SensorWidgets, RoomCard / RoomPanel, PersonTracker, Sparkline, ScenePills.
• DashboardView renders a view's scenes + tile grid; RoomNav switches rooms.
• DetailPanel flyout — full controls, camera feed, history graph, scenes, links.

At-a-glance header strip

GlanceStrip shows a row of summary buttons (lights on, who's home, climate, media, etc.). Fully configurable in edit mode:

• Pick each button's metric (lights/switches/fans/locks/covers/climate/people/media).
• Set a custom label.
• Toggle the flyout on/off (tap a button to see the entities behind the number).
• Build a per-button exclude list — tablet/kiosk screen lights are filtered by default so they aren't counted as room lights.

Config persists on the view (view.glance) so it syncs across devices. The header greeting is dynamic — it names whoever is actually home from the person.* states (e.g. "Good night, Jeff & Carissa!" or just one name). When nobody is home it drops the names entirely and shows only the time-of-day greeting ("Good morning") — so a user viewing the dashboard while away isn't greeted by name.

"Premium feel" polish

Top picks

• Album-art color extraction — dominant color from now-playing artwork tints the media tile/flyout glow (useArtworkColor + colorExtract).
• Shared-element artwork → flyout — media artwork morphs into the flyout via the View Transitions API.
• Animated media progress bar / equalizer on playing media tiles.
• Haptics + spring press — a delegated pointerdown listener fires navigator.vibrate(8) on touch/pen taps; tiles snap on :active.

Motion & micro-interactions

• Spring-physics flyout open (scale + blur-in).
• Staggered tile-entrance cascade on view switch.
• Animated value transitions — count-up temps, smooth brightness fills, crossfading album art.

Living, ambient feel (AmbientBackdrop)

• Time-of-day ambiance — dawn/day/dusk/night gradient tint, refreshed each minute.
• Weather-reactive backdrop — rain streaks / snow flakes driven by the weather entity; nothing renders for clear weather; lightning during thunderstorms.
• Live light color — a light tile's glow matches its real RGB / color-temp.

All animations respect prefers-reduced-motion: reduce.