Building a Home Assistant Dashboard with Whole Home Audio Control

Mon, 26 Jan 2026 00:00:00 +0000

My Home Assistant dashboard has evolved significantly over the past year. What started as the default auto-generated cards has become a carefully organized interface that my whole family actually uses. Here’s how I built it, with a focus on the whole home audio system that ties everything together.

Dashboard Philosophy

Before diving into implementation, a few principles guided the design:

Function over flash - Every card earns its screen space
One-tap actions - Common tasks shouldn’t require drilling into menus
Status at a glance - The overview tells you what’s happening without interaction
Mobile-first - Tablets mounted around the house are the primary interface

The Stack

Lovelace YAML mode - Full control over layout and structure
Mushroom cards - Clean, consistent UI components
Custom Layout Card - Responsive grid layouts that work on any screen
Stack-in-card - Grouping related controls together

Overview Page

The overview page is designed to answer “what’s happening right now?” at a glance:

- type: custom:mushroom-chips-card
 alignment: center
 chips:
 - type: weather
 entity: weather.katw

 - type: template
 entity: person.rusty_bower
 icon: mdi:account
 icon_color: "{{ 'green' if is_state('person.rusty_bower', 'home') else 'grey' }}"
 content: Rusty

 - type: template
 icon: mdi:lightbulb-group
 icon_color: "{{ 'amber' if states.light | selectattr('state', 'eq', 'on') | list | count > 0 else 'disabled' }}"
 content: "{{ states.light | selectattr('state', 'eq', 'on') | list | count }} lights"

The chip bar at the top shows:

Current weather
Who’s home (person tracking)
How many lights are on (tap to navigate to lighting)
Garage door status (red = open, green = closed)
HVAC status (heating/cooling active)
Upcoming trash/recycling days

Quick actions provide one-tap scenes: Goodnight, Spa Mode, All Lights Off, Close All Garage Doors.

Whole Home Audio Architecture

The audio system uses a Xantech DAX66 multi-zone amplifier - a commercial-grade matrix amplifier that can route any of 6 sources to any of 18 zones independently. Each zone has its own volume control and can play different content simultaneously.

The Zones

The house is wired with in-ceiling speakers across 15 zones spanning three floors - main living areas, bedrooms/offices upstairs, and utility/recreation spaces in the basement. Plus a dedicated Theater with an Anthem AV receiver for serious listening.

Integration Approach

The Xantech communicates via RS-232, but I needed network access from Kubernetes. The solution is a socat bridge running as a sidecar:

containers:
 - name: socat
 image: alpine/socat:latest
 args:
 - "-d"
 - "-d"
 - "TCP-LISTEN:7001,reuseaddr,fork"
 - "TCP:10.0.10.209:4999,keepalive,forever,interval=10"

This bridges TCP connections from Home Assistant to the serial-to-ethernet adapter connected to the Xantech. The keepalive,forever ensures the connection recovers from network hiccups.

Home Assistant sees each zone as a media_player entity with source selection and volume control.

Audio Dashboard Design

Designing the audio UI was tricky. With 15 zones, a traditional media player card for each would be overwhelming. The solution is a two-column layout: streaming controls on the left, zone controls on the right.

Streaming Column

The maxi-media-player card provides a full-featured player with album art as a blurred background:

- type: custom:maxi-media-player
 entities:
 - media_player.spotify
 - media_player.zone_1
 - media_player.zone_2
 # ... all zones
 sections:
 - player
 artworkAsBackgroundBlur: true

This gives you playback controls, track info, and the ability to cast to any zone - all in one card.

Zone Controls Column

For the individual zones, I use mushroom-media-player-card with a horizontal layout. Tap to toggle on/off, volume buttons for quick adjustments:

- type: custom:stack-in-card
 cards:
 - type: custom:mushroom-title-card
 title: Whole Home Audio
 subtitle: Upstairs
 - type: custom:mushroom-media-player-card
 entity: media_player.zone_1
 name: Zone 1
 layout: horizontal
 volume_controls:
 - volume_buttons
 - volume_set
 media_controls: []
 collapsible_controls: false
 tap_action:
 action: toggle
 - type: custom:mushroom-media-player-card
 entity: media_player.zone_2
 name: Zone 2
 layout: horizontal
 volume_controls:
 - volume_buttons
 - volume_set
 media_controls: []
 collapsible_controls: false
 tap_action:
 action: toggle
 # ... more zones

 - type: custom:mushroom-title-card
 title: ""
 subtitle: Main Floor
 # ... main floor zones

The key settings:

layout: horizontal - Compact single-line layout
volume_controls: [volume_buttons, volume_set] - Both +/- buttons and a slider
media_controls: [] - Hide play/pause since we control that from the streaming card
tap_action: action: toggle - Tap the card to turn the zone on/off

This puts all zones in a scrollable card organized by floor, with the streaming player always visible on the left.

Scene Integration

The real power comes from combining audio with other automations:

Spa Mode

One tap: dims the outdoor lights, starts a relaxation playlist in the relevant zone, adjusts the HVAC.

- type: custom:mushroom-template-card
 primary: Spa Mode
 icon: mdi:hot-tub
 icon_color: cyan
 tap_action:
 action: call-service
 service: scene.turn_on
 target:
 entity_id: scene.spa_mode

Goodnight

Turns off all audio zones, sets overnight temperature setpoints, dims lights to 5% in hallways, locks doors.

Party Mode

Syncs all main floor and outdoor zones to the same source at matched volumes.

Theater Integration

The theater runs separately on an Anthem AV receiver, integrated via IP control. It gets its own section with proper media controls:

- type: custom:mushroom-media-player-card
 entity: media_player.anthem_av
 name: Anthem AV
 use_media_info: true
 show_volume_level: true
 volume_controls:
 - volume_set
 - volume_mute

The theater lighting also has dedicated scene buttons: Off, Movie (5% seating lights), Intermission (50%), and Full brightness for cleaning.

Tablet Deployment

Fire tablets run Fully Kiosk Browser showing the dashboard at key locations - one on the main floor for everyday use, one upstairs, and a portable tablet that docks at a charging station when not in use.

The Admin page shows tablet connectivity status so I know if one has gone offline.

Lessons Learned

YAML mode is worth it - The visual editor can’t do responsive layouts or template chips
Group by function, not location - “Lighting” view is more useful than “Living Room” view
Limit visible options - Show the 80% use case, hide the edge cases behind taps
Test with family - My initial designs were too information-dense

What’s Next

Music Assistant integration for better source management
Voice control via local Whisper for “play jazz in the kitchen”
Presence-based audio - automatically route music to follow occupancy

The dashboard continues to evolve, but the core principle stays the same: make the smart home actually easier to use than the dumb version.

Audio on Rusty Bower