A modern Home Assistant dashboard built on Material Design 3 (MD3) principles, featuring dynamic colors, transparent and adaptive card layouts, and a sleek, clean UI for an elegant smart home experience.
This comprehensive dashboard unifies control and monitoring for lights, switches, temperature and humidity sensors, rainfall, wind, UV index, radar, weather forecasts, alarms, Hue scenes, cameras, heat pumps, door and window sensors, and irrigation control - all presented in one cohesive, visually refined interface designed for both functionality and aesthetic harmony.
The v4.0.0 major update introduces a significantly more modular system across most cards, making customization far easier than before. Previously, I had to manually adjust large portions of the dashboard to fit their setup. Thanks to the new streamline card architecture, much of the backend complexity has been consolidated. You can now map your entities directly through the UI, reducing setup time and improving flexibility. You can check all the streamline_templates I've used in the dashboard.
In addition to this core upgrade, the update also includes several quality-of-life improvements: a new media player on the overview page, refined layout adjustments for cleaner organization, and expanded use of pop-up cards to keep the interface tidy and intuitive.
🎨 MD3 Theme Engine
Unlock unlimited color combinations with a simple color picker - thanks to the amazing work of Material You Theme repository.
👥 Per-User Styling
Each family member can have their own unique style and colors. Perfect for customizing your phone, tablets, and shared devices.
💡Community Inspired
Several cards are inspired by the incredible work of others in the Home Assistant community. Credit will be detailed below.
Overview Page
Page Description
The Overview page serves as the central hub for monitoring and controlling most of my smart devices. At the top, it displays a personalized greeting along with the current time, weather conditions, wind speed, and the day’s high and low temperatures.
To the right, there are dedicated Climate and Irrigation tabs for managing the thermostat and sprinkler systems. Below them, I have a Media Card, Calendar, and Alarmo, with a notification chip for quick alerts. When no media is playing, the media card switches back to calendar and backyard camera.
Next, the dashboard features Room Cards that provide quick access to thermostat controls, lighting toggles, and the current count of open doors or windows.
Finally, the main page includes four live camera feeds, streaming in real time for immediate visual monitoring.
Weather Forecast and Notifications Page - Individual Room Page
Weather - Notification page combines all my weather information and notifications in one place for quick status updates and alerts.
On the notifications side, I use a variety of conditional cards powered by timers and booleans to make alerts appear only when needed - for example, reminders like “wash duvet”, notifications when the sprinklers are running, or warnings about an open door.
The weather section is designed to be clean and informative. Certain cards - like weather warnings, earthquake alerts, and volcano warnings - remain hidden unless there’s an active event (depending on your local integration). The rest of the display includes detailed weather data, rainfall, UV index, wind conditions, lunar information, and a live radar map, giving me a complete view of current and upcoming conditions.
Individual room page provides detailed controls and status information specific to that space. At the top, it displays the current temperature, room presence, and the last seen timestamp from the occupancy sensor.
Below that, there are light controls, including both slider and button cards, allowing for easy brightness adjustment and quick toggling.
Next to the lighting section, there’s a Climate Control panel that lets me manage the room’s temperature settings, select operation modes, and view the thermostat’s daily runtime. It also shows the current humidity level for that room, including how long the runtime of the climate for the day.
On the right side, two conditional cards appear only when a door or window is open, helping highlight important changes at a glance.
Finally, a Media Card sits inside the pop up card, providing quick access to audio or video playback within the room.
Hue Scene Page
Page Description
I’ve always loved Philips Hue, but instead of using their bridge, I connect my lights directly through Zigbee2MQTT (Z2M). To recreate the familiar Philips Hue app experience, I use the hass-scene_preset integration from HACS, which lets me simulate Hue’s scene controls and build my own room selector.
All of this comes together thanks to the incredible work of the Hypfer - the mainainer of hass-scene_preset, along with a combination of automations, scripts, input_selects, and booleans that make the whole setup seamless.
Camera Page - Timeline and Alarm Page
Page Description
I like having all my cameras displayed together on a dedicated page. There are six cameras around the house, and this page gives me a complete live view of them all in one place.
At the top, there are buttons that let me toggle vehicle and person detection automations. Beneath each camera feed, I’ve added light controls, allowing quick adjustments to the nearby lighting directly from the same view.
I also have my Alarmo integration panel, which can be accessed by clicking the Alarmo button on the Overview page. Right next to it, I display the 10 most recent recorded events, each automatically described by LLM Vision - adding a smart, futuristic touch to the camera setup.
Server - Irrigation Page
The Server Page is where I monitor the health and performance of my smart home system. I’m running Home Assistant OS (HAOS) on a mini PC through Proxmox, which is fully integrated into Home Assistant for live monitoring.
This page tracks key system metrics such as memory usage, CPU temperature, network activity, and device battery levels (highlighting any that drop below 60%). It gives me a quick overview of my server’s status and connected devices at a glance.
The Irrigation Page manages my sprinkler system and garden monitoring. I use two Sonoff Smart Valves to control water flow to the sprinklers, supported by several soil sensors that track both temperature and moisture levels.
To visualize performance, I’ve built a custom graph showing water flow trends, and I’ve automated irrigation timers through a combination of automations and scripts, making the watering system efficient and fully autonomous.
Calendar Page
Page Description
The Calendar Page provides a full view of my appointments, events, and schedules in one place. It’s a dedicated page that pulls in data from my linked calendars, giving me an easy way to stay on top of upcoming tasks and daily plans right within Home Assistant.
Extra Cards
Above is an example of lock card.
The above is scene example card with mushroom entity card.
And last one, is a cover card example.
Card Related Stuffs:
- Alarmo Card
- Apex Charts Card
- Bubble Card
- Button-Card
- Calendar Card Pro
- LLM Vision Card
- Mediocre Hass Media Player Cards
- Mini-Graph-Card
- Mushroom
- Navbar Card
- Simple Swipe Card
- Simple Tabs Card
- Timer Bar Card
- Web RTC Camera
- Week Planner Card
Weather Related:
- Lunar Phase Card
- Lunar Phase Integration
- World's Air Quality Index
- Weather Card Extended
- Clock Weather Card HUI Icons
Theming / ETC:
- Auto-Entities
- Card-Mod
- Config Template Card
- Kiosk Mode
- Layout-Card
- Lovelace Material Components
- Material Symbols
- Material You Theme
- Material You Utilities
- My Cards Bundle
- Paper Buttons Row
- Stack In Card
- Scene Presets
- Streamline Card
- Vertical Stack In Card
- Save all (optional) of the streamline_templates I've created and to remove the one you don't end up using.
- Choose which card / visuals that you like to be added to your installation by clicking the hyperlink provided in the description above.
- Install the required HACS components (such as simple swipe card, stack-in-card, popup-card, etc. - see your setup for what’s needed).
- To unlock the full functionality (like weather icons, notification counts, and more), you’ll need to add the corresponding sensors to your config.
- For the Hue scene, you'll need to have the automation, scripts, input boolean, input text, and input number in your system that you can find in hue asset folder. For the images, you can get them from here.
- Apply the MD3 theme and select your preferred colors. It is accessible from Overview page > More > Theme Icon
- Select the Transparent option in Card Type to get the wide-system transparent cards
- Enjoy your personalized dynamic tablet dashboard! 🎉
This project builds upon the work of:
- Nerwyn – Material You Theme & Material You Utilities
- MySmartHome - for the new tabs button, button cards styling, sliders, etc
- Other community members who kindly shared their cards
If you want to hire me to make your personal dashboard, you can hit me up on one of these social media platforms below:
Or you can support me on Ko-fi. Your support helps me keep creating and sharing more awesome open-source tools! Thank you for being part of this journey 🚀