EASY Lovelace Mobile Dashboard | Home Assistant Tutorial

Easy, Incredible Looking Lovelace Dashboard built using the Grid Card! Super EASY! No YAML files (4 small YAML edits in the editors). No Custom Cards. I call it the Tile Dashboard.

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

Drop some love to the other social media:

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

0:00 Intro
1:08 First Time Editing Dashboard
2:06 Overview of Dashboard & Features
7:23 Creating the Dashboard
25:35 Outro

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

Music provided by Monstercat:
Grabbitz - My Cloud

#HomeAssistant #Lovelace #DashboardDesign

[ZackBarett]

Let me know what Dashboards inspire you and I may make a video explaining the easiest way to recreate it!

[tonnysenioranthony]

Very good explanation, and thank you for not playing music under your narration. (Most YouTube creators play a terrible repetitive distraction music loop underneath the instructions, thanks again for not doing that)

[olivermcintosh]

Hello Zack. Must say, I have seldom learned so much in such a short period of time. This approach to building Lovelace dashboards into practical panels is inspirational. Thanks you.

[keepitdialed]

Just discovered your channel - dude. Dynamite content! This is exactly what I’ve been wanting to know about home assistant, dialing it in. Etc. good stuff buddy. Keep it up.

[AndreViens]

This is an awesome tutorial about making a beautiful interface for Home Assistant. Everytime I open up HA, I get overwhelmed so I like this approach of containers and breaking down the different grids.

[Np]

I never comment on YouTube videos but absolutely had to on this one.

I’ve been so frustrated having everything setup but being unable to make a Lovelace dashboard that isn’t awful. Just the columns and square YAML edit tips in the grid card are huge and going to help a lot. My next hurdle are to get this looking good on a tablet.

Subscribed!

[BBalasa]

Too good, thought to watch for start of 5 mins, ended up till the end of the walk through, very good tips and high quality walk through...

[SenZubEanS]

This was great. I don't know exactly what I want to see more of yet in the dashboard front as I'm just starting out but please, keep 'em coming!!!

[thomasloven]

This is awesome! You inspired me to finally to pull myself together and redo my interface.

[AllenGoldschmidt]

Very informative. Got me over the hump of understanding how to build dashboards. Thanks!

[thierry]

This is very nice and clean Zack, similar to a Control4 interface. Great job walking through the steps to take. Thank you

[dreamvisionary]

Thanks for the tutorial. The end results are very nice but a drop, drag and resize grid card interface would be a dream for many I'm sure.

[CilfaNieraad]

Thank you for this fantastic walkthrough!
The latest HA update (this months) dispenses with the need for yml-editing for setting the columns of the buttons, which is very nice.

[eobeniche]

Thanks for sharing that way to do your dashboard. I just add one thing who can be usefull, you navigate to your bulbs but you didn't add a back button, so i improvise a small arrow to go back to "home" on top of each other page !

Looks like this, i'm sure you will find a better way to do it but it works :

type: grid
columns: 8
cards:
- type: button
tap_action:
action: navigate
navigation_path: home
icon: 'mdi:arrow-left'
show_name: false
show_icon: true
hold_action:
action: navigate
navigation_path: home

[sfenne]

Great tutorial. I wouldn't mind autocomplete added for icons (preferrably with icons in the dropdown).

Looking forward to a revamped locelace in the future!

[BrianSimmons]

If you have an alarm system you should set up Home Assistant to trigger your "Leaving Home" scene when the alarm is armed "away". The point of home automation is that activities like this are automated. Having to open your phone to engage the "Leaving Home" scene isn't very automated. Likewise, when someone arrives back home and "disarms" the alarm, you can trigger your "Home" scene. We have different triggers set up in our automation system (not Home Assistant) based on if the alarm is armed "away", "vacation", "night" or "disarmed" and also have a "is dark" type of logic so that lights are turned on when it is dark outside but not during the day. These scene primarily change light status and HVAC set points, but also make sure all A/V equipment is turned off when leaving, etc. You can really set these up to do anything.

[raysieber]

I like the compact home screen that lets you drill down to the details if you need it. I have been planning for a long time to draw my rats nest of lovelace views on a white board and plan something exactly like this. Thank you for the kick start

[IanTakats]

That was a great video. Very clear and easy to follow. I have now got a very useful set of views with some great functionality. Well done!

[jamesrowley]

Hi Zack, great videos, really inspiring! Please can I ask which theme you are using on this particular video?

[philou]

I really like your videos ! You explain very well and with a good rythm, thank you very much Zack! I would like to see one video that explain how to use CSS to tweak those cards, size, borders, opacity and others, do you have one? Also I would like to use minus and plus buttons for lights instead the circular potentiometer because it is not really easy to use on a smaller display, etc.