Vigyata.AI
Is this your channel?

Create an AWESOME looking Lovelace Dashboard with no YAML Files in 2020! - Home Assistant - How to

125.5K views· 1,700 likes· 18:49· Nov 29, 2020

🛍️ Products Mentioned (4)

Learn how to create a functional Lovelace Dashboard in just 15-20 min that's all created by you! Also, get a good look at what I think is the best mobile dashboard. Sponsor me: https://github.com/sponsors/zsarnett ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Drop some love to the other social media: 🐤 Twitter: - https://twitter.com/NKDZCK ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Soft UI Theme: https://bit.ly/3q3Cmns Synthwave Theme: https://bit.ly/3miPbbn Windy Radar: https://www.windy.com * Hamburger menu - Embed Widget on page ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ 00:00 Intro 01:00 Creating a new dashboard 02:39 Explaining the Dashboard 04:49 Build the Lovelace UI 12:40 Themes 13:33 Mobile Dashboard 17:48 Outro ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Music provided by Monstercat: Grabbitz - My Cloud https://youtube.com/monstercat https://youtube.com/monstercatinstinct #HomeAssistant #Lovelace #HomeAutomation

About This Video

If your Home Assistant dashboard looks more like a data dump than an actual dashboard, this video is me walking you through how I take the default generated UI and turn it into something clean, functional, and actually nice to look at. The big goal here is simple: build an AWESOME Lovelace layout using the built-in visual editors, with no YAML file editing. There’s a tiny bit of YAML inside the UI editor for a buttons footer, but you’re not digging into “that dirty YAML file mess.” I start from a blank slate by taking control of Lovelace (zero risk, because you can always go back or make a new dashboard). Then I build a left-side “stack” using a Grid card (one column, square off) to keep things consistently ordered on any screen. That stack includes a weather card, an interactive Windy radar embedded with a Webpage card, scene buttons in a nested grid, and a quick glance at upstairs/downstairs temps using entity attributes. After that, I show how I build the right-side area cards: an Entities card with a picture header (so each area is obvious), a clean divider section, and a buttons footer for quick actions like toggling all lights in a room. I wrap it up with theming (Soft UI and Synthwave) and what I think is the best mobile approach: a room overview that navigates into separate per-room dashboards so mobile stays fast and uncluttered.

Frequently Asked Questions

🎬 More from Zack Barett