Creating a Beautiful Home Assistant Mobile Dashboard Easily!

In this video I show you how to create a clean and minimalistic smart home dashboard using Home Assistant and Mushroom. Mushroom is a take on Minimalist UI, that has a focus on making things easier to use, with everything being accessible from the UI to click and select. This makes it possible to build a really nice mobile smart home dashboard very easily, and also quickly!
Join the Locket Insiders Programme:
locket.insure/insiders/?...
Get a Quote for Locket Insurance:
locket.insure/insiders/?...
If you'd like to support me and future projects:
Patreon:
/ everythingsmarthome
Buy Me a Coffee:
www.buymeacoffee.com/EverySma...
Written Article:
everythingsmarthome.co.uk
Links:
GitHub: github.com/piitaya/lovelace-m...
HACS Install: hacs.xyz
Template card code: gist.github.com/EverythingSma...
EVERYWHERE YOU CAN FIND ME:
Everything Smart Home Community Discord:
discord.everythingsmarthome.c...
Twitter: / everysmarthome (@EverySmartHome)
Instagram: / everythingsmarthome
Facebook: / everythingsmarthomeoff...
#homeassistant #smarthome
________________________
Some of the links above are affiliate links, where I earn a small commission if you click on the link and purchase an item. You are not obligated to do so, but it does help fund these videos in hopes of bringing value to you!
0:00 - Intro
1:27 - The difference between Minimalist and Mushroom
3:33 - What we are building today
4:37 - Installation of mushroom
5:27 - Creating a new dashboard
6:20 - Creating the main page
23:28 - Creating a room view
32:10 - Final completed dashboard

[@EverythingSmartHome]

Hope you enjoy this one, please do me a HUGE favour and leave a comment down below, this video has been a nightmare to get out so I hope it is useful! 🙏

[@Waterbottle365]

Can you add that template configuration information to the description or in a comment? Great video!

[@EverythingSmartHome]

It's been in the description the whole time my friend 😅

[@Waterbottle365]

@@EverythingSmartHome I am blind :(

[@static_sid]

Hey, I just wanted to thank you for your content, it has helped me get started with HA and a smart home. I am still new to HA, learning things but your videos help me a lot. Also, wanted to setup minimalist ui since a long time but wasnt sure how to get started, this and the previous video were very helpful to me.

[@EverythingSmartHome]

Thanks very much, comments like that make my day 🙏

[@dustinjorden6594]

Any plans on doing this type of video for your wall mount tablet setup?

[@EverythingSmartHome]

Sure if enough people want to see it

[@Chris_Cross]

@@EverythingSmartHome Yes please

[@zwart592]

@@EverythingSmartHome yes please!

[@rob1971]

@@EverythingSmartHome me too please... Even although you're costing me a fortune 😉

[@denekampmark]

@@EverythingSmartHome yes

[@seantunley336]

Awesome video! Small little tweak to the kiosk mode code. This allows kiosk mode on mobile but not on the desktop, for easy editing! Was a big time saver for me. kiosk_mode: mobile_settings: hide_header: true

[@EverythingSmartHome]

Good spot, thanks!

[@zwart592]

I'm not sure what you are saying here?, it sounds important tho. I am using both phones and a wall tablet thing. Is that what makes the difference here? Or is kiosk not linked to wall tablet in this context?

[@seantunley336]

@@zwart592 So essentially, in the video when putting in the kiosk mode, it changed both the desktop (where you are editing) and the mobile device dashboards (phone and tablets included). When you needed the headers again for editing, you would have to disable kiosk mode, as was demonstrated in the video. Using this small tweak to the kiosk code, the headers will remain on desktop version of the dashboard (which is really handy for tinkering and editing) but will always be hidden on the tablet and phone dashboards. This way, you never have to disable kiosk mode to get back to the headers and its clean and tidy on all mobile devices by design 🙂 Hope this helps!

[@zwart592]

@@seantunley336 It sure helps! Thanks for explaining, great!

[@clairerovic]

This is a magic tip, thanks for sharing.

[@dpippet]

Excellent tutorial Lewis. Could please share the entity that you use to count the number of turned on lights?

[@user-ei2do9lb1e]

Сreate a new sensor with counting in templates: - platform: template sensors: lights_on_off: value_template: > {% set lights = [ states.light.first, states.light.second, states.light.third, states.light.etc ] %} {{ lights | selectattr('state','eq','on') | list | count }} {{ lights | selectattr('state','eq','off') | list | count }}

[@CilfaNieraad]

@@user-ei2do9lb1e Thank you! Should "states.light.etc" be literally that?

[@s80keys]

This is easily one of my top favorite Home Assistant tutorials - the time and effort you put into making this video is incredible. Your dashboards are so clean and functional, and I really enjoyed following along to replicate it in my dashboards. This was my first time using anything in HACS but everything fell into place exactly as you described. The mushroom dashboard is great, but I think I will try to tackle minimalist too at some point. Thanks again for the great videos!

[@bsem68]

Great video. I realize this is older and not sure if mentioned in comments, but since then they added Subview for different views, so no more need for the back chip and views are hidden at top that have this subview enabled :) Also a benefit of using Grid Card vs. Horizontal Stack for Rooms is you can set to two colums and then able to re-order rooms around and they are not locked into pairs. Finally, put everything onto a page in vertical stack, otherwise the cards will shift around if using something with PC or iPAD.

[@AndreasLimpert]

thanks for your comment. saved me. 🙂

[@federicoboretto6630]

saved me too man

[@csgrabben]

I have legit wanted to have this dashboard for SO LONG but never had the time to dig into it. Ever since your video last week I have waited for THIS one. Going to be a nice watch!

[@My427Cobra]

This was awesome! Spent the day watching the video and migrating my current dashboard and views. Thank you so much for putting this together and making it easy to follow along. I appreciate you sharing the templates as well, that makes a nice addition to the cards.

[@igiannakas]

You cannot imagine how great your video was! After 2 years with HA I’ve just redone my whole dashboard plus now included customised pop ups with the browser_ mod to handle more info screens instead of navigating. You simply ROCK 🙏🏻👏🏻

[@stedy142]

Thank you for this. One of, if not the best tutorial I have come across soo far. The time and effort you have put into it is clear and has not gone unappreciated! 💯

[@ericisrael7598]

Wow … really impressed how easy and instructional your videos are. Tons of good content out there but you really bring it home easily. Can’t imagine how much time it must takes to do these. Appreciate the effort ….

[@LeberAdanek]

Dude, this has been super useful. I am new to home assistant so a walkthrough to the dump of data that Home Assistant gives you is a god send.

[@DamienGultig]

So glad you managed to get this up. This is my evening sorted.

[@EverythingSmartHome]

Have fun my friend! 😅

[@gsrawe]

Looking good. Another tip - the Grid card will save you a lot of time from having to add multiple Horizontal Stacks for your rooms/entities. You can set the number of columns to 2 and uncheck "force square".

[@itcsburnett]

i was trying to do that as well, coupling with auto-entites but it kept putting all the entities into a single column

[@winfriedtheis5767]

I was about to say the same, and if you then vertically stack with a title card, everything stays together as intended! ;)

[@PedrokasPT]

I only can say THANK YOU ! Your tutorials are amazing but this one really is outstanding ! Loved ! And learned a lot and designed my new mobile dashboards all thanks to you your dedication to the HA community ! I really can’t wait for the upcoming tutorial regarding minimalist 🙂 I would suggest (if I Amy) that you could cover also things that cannot be done with Mushroom when you cover the Minimalist Tutorial. That would be a nice way for your audience understand the differences and why it would make sense to use Minimalist in certain aspects. Again a huge thank you and accept by best regards from a Portuguese follower and fan ! Cheers :-)

[@chrismullins8061]

I appreciate the effort that went into this (and your other videos as well). Based on the strength of your vids, got my own HAOS setup at home (w/ Frigate, ESXi, etc...) going in about a month. Thank you for enabling all of us beginners. Lovely work, sir.

[@Whimsical_Ravioli]

New to using home assistant so this has a lot of appeal to me. Your channel got me to make the switch to a local smart home. Got 90% of my home running local now!

[@timothymitchell7250]

Thanks, once again! I've been wanting to update my dashboard, but this brought it back to the forefront. Mushroom does make this really easy with the chips, etc. Going through and roughing things out now for a more user-friendly experience.

[@VictorVizcarraS.]

I was looking for quality content in many videos and finally I could find it in your channel, I am very grateful to you.

[@DanielFriedmann]

Fantastic video, Lewis. I'm still new to HA but this video makes me want to spend more time transforming the rather boring but already amended standard dashboard into a fancy custom one with separate pages for each room

[@nunoalexandre4273]

Excellent video, it's just perfect and a joy to watch, can't thank you enough. I'm trying to use your ideas for my new home dashboard but in a tabled, in landscape! So, I'm struggling to tidy up everything like you did on our tablet. I would love to see more of your excellent design skills. Please keep up the great work!

[@ygdiget4119]

Great video! Very informational and contained tons of supplementary knowledge necessary for us to create our own mushroom card dashboards!

[@eoslo]

I'm close to move and your channel is just perfect, your content is everything I need, you are doing a great job, thanks!

[@mrmatistp]

thank you, been using HA for a while but never attempted to create mobile dashboard as it was always to time consuming, but your vid and mushroom allowed me to have dashboard i always wanted! thank you!

[@jayjake]

Just starting to customise my flat, this is absolute must have for me, love it

[@paulrain5743]

Absolutely fantastic video! I can't imagine how much time and effort it took to make it. Saved me so much researching.

[@PrecisionEngineeredJank]

your content is still the greatest for HA. thank you for all that you do

[@donster222]

Simply amazing video. Thank you for taking the time to do this. So thorough!

[@sltwin]

Thank you Lewis. Been looking at other mushroom related videos but this one definitely nailed it with the explanation on templates. Thxs a lot!

[@EverythingSmartHome]

Glad I could help

[@thecombsfilms]

Incredible walkthrough. Thanks so much for sharing, your channel has propelled my HA integration so much!

[@JohnSmith-vt8si]

Thank You Lewis, another great tutorial. I've added this to the top of my ever-expanding todo list

[@JamieAlban]

This is a really great setup, huge step up from the defaults. I feel like there's still a long way to go for home assistant to make this layout building less painful though!

[@fred7flinstone]

Thanks. Awesome video. Been thinking about changing the look and feel of my dashboard for a while now and this gives me the inspiration to finally get started.

[@grbansen]

Thanks again for your great efforts, thorough descriptions and details. Always learn something of use in your videos.

[@berttammer4900]

Hi Lewis, this is/was a very, very useful video! I followed it carefully and now i have a beautiful dashboard. (I did use some other cards as well, like cover card with a nice animation). Thank you for again a really great and useful video!

[@DaleThomasNYC]

Great videos! Learning alot and trying to follow step by step to create my new dashboards using the mushroom cards.

[@westcoastpyro9769]

Freaking awesome as always. This is my first dive into the mushroom cards setup and trying to get a tablet up on the wall so I'll be using this as a definite jumping off point. Thanks!

[@bill_automated1226]

I have been thinking about moving my dashboard to mushroom, this really helps... Thanks for a great video Lewis.

[@carlosroldao]

Oh boy just in time for the weekend! Great stuff.

[@EverythingSmartHome]

Weekend sorted 😎

[@ayrtonfineout442]

Oh man. This is going to be a great weekend. I started the hard mode after you put out the Minimalist video. Definitely changing to Mushroom!

[@EverythingSmartHome]

Haha try both, see how you get on! Just don't delete your hard work so far incase you want to go back

[@kasikcz]

This is exactly what I needed, easy simple Dashboard even children are able to use!

[@doble_G]

Excellent video!!! Where do you get the count lights entity from?

[@theattorney6072]

Exactly this ...

[@ajays2060]

Nice! I just went through the rabbit hole of watching various videos on dashboards and watched your Top 5 Dashboard video before clicking this video and you wearing a tshirt with word 'nice' had be cracking up🤣🤣 that is a good easter egg! thanks for all your videos and effort you make with putting all this together and the additional personal touch - its all so....nice!

[@dd13012]

Great video, thanks for sharing your experience in such an easy way to understand ! Mushroom seems powerful enough for my uses as it is.

[@EverythingSmartHome]

Glad it was useful

[@streetwiztech5505]

Only just got around to playing with dashboards.. but now i've started i'm appreciating the ease of use... rather than scrolling down all my rooms in one page

[@fightingmajor]

Appreciate your videos. I like having the full navigation of my rooms at the top so I just created buttons for each room in helpers and then added those as chips at the top navigating to the room with no info on the cards other than the icons. Created them once on the main screen with the navigation info filled out and then duplicated the card and moved each duplicated card to the top of each room.

[@acebentura]

Awesome video. Have been wanting to make some decent dashboards for a while but always just ended up not really knowing what to do. This has helped so much!

[@dangrab0wski]

I already have my yaml Minimalist version set up, but not without its issues or quirks. This video has me wanting to try out Mushroom on a secondary dashboard so I can compare options, while I desperately wait for the Minimalist video. Thanks Lewis for your hard work in getting us this video!

[@EverythingSmartHome]

Thanks, be interested to hear what you think!

[@halooche]

Your videos are great! They’re super useful and really easy to follow.

[@dimitargatev9861]

Thank you so much! A lot of basics covered in the vidio that I struggeld with initially. This is a very good starting point for anyone getting into Home Assistant.

[@JamesTewAustralia]

Bloody great video Lewis. Thanks for the step by step

[@mnededeejay]

Thanks for the tutorial, I've got a great looking dashboard now!

[@dretwav]

Thanks, Lewis. I must say the adding room cards was quicker using the code editor to copy and paste for each room than using the ui.

[@BioSniper]

Thanks for making this! Inspired me to finally sort my mobile dashboards and mushroom really does make it much easier to make something that looks nice!

[@EverythingSmartHome]

Nice one, glad it was useful!

[@HowardPrice]

Awesome video Lewis! I followed along and now have something the rest of the family can use without me playing tech support. Much appreciated!

[@EverythingSmartHome]

Nice one, glad I could help!

[@BillyDickson]

Great explanation on using HA, thanks for taking the time to explain the process.

[@EverythingSmartHome]

Thanks for watching!

[@loftistv9429]

Fantastic job. Finally, a dashboard the wife is happy with... 😁

[@Trial_Master]

Thanks so much for the tutorial. I have been using Dwain's Dashboard and have been building my confidence to have a go at a Dashboard. I'm very happy with this one, looks very nice!

[@welcomattic]

Awesome video! You master the dashboard creation, good job dude!

[@arsenal548]

What a great guide! Thank you, this gave me such a good intro into HA.

[@souljunction]

Excellent video! Really helped a starter with HA.

[@panniechristou9644]

Thanks , great video , well explained , nearly finished mine , thank you so much !

[@ehink2716]

Man this was a great video, you really did a good job covering everything. While explaining I would think of a question and then you would follow-up with the answer. Great job. As well as explaining issues ahead of time that people could come across like what to do if HACS doesn't show or the icons are missing.

[@EverythingSmartHome]

Ah thanks so much, really appreciate the feedback and glad you enjoyed!

[@mindracing]

Excellent job, Lewis. Really well done. The two things I'm missing from Mushroom are input_numer and input_select options. I'm sure they'll come though.

[@wongbrandon]

Very detailed guide - i created my first dashboard through this video!

[@Chris173972]

Thanks for doing this! This gave some much need polish to my lovelace... I mean my dashboards!

[@607AAG]

Wow...thank you! My wife will thank you too once I get this done!

[@RichSimpson]

Followed this yesterday with good results. Thanks.

[@EverythingSmartHome]

Excellent, glad it helped!

[@johnny_wheelz]

I'm a self-confessed newbie and idiot. I found these instructions wonderfully easy to follow. Fits my needs perfectly

[@EverythingSmartHome]

Haha nice, glad you found it useful!

[@rob1971]

Another really clear video, thanks Lewis 🍄

[@knotfreak02]

Thank you! This was such a help to get going with a much better looking UI.

[@mehdichaouachi]

Omg, this is exactly what I was looking for, a complete tutorial on how to us the muhsroom cards. Thank a lot. You have gained a loyal follower.

[@EverythingSmartHome]

Nice one, glad I could help

[@NicozStrat]

Thank you so much for what you do man, your tutorials are amazing and super helpful!!

[@oleav1539]

Just made my mobile dash based heavily on this video :) Thanks for your tutorials.

[@EverythingSmartHome]

Awesome!

[@mikepeterson443]

This is really useful. Up to this point, my HA views have been very utilitarian. Now it has some class.

[@lukasemann4621]

Nice video. Can't eat for your tutorial for Minimalist UI

[@ungeekenmunich]

Amazing, it looks super neat!

[@SmartHomeJunkie]

Totally awesome tutorial. Thank you!

[@alistairmerritt]

Thanks Lewis! This has been fantastic to refer back to!

[@static_sid]

you've no idea how much you have helped me by making this video

[@EverythingSmartHome]

That's awesome! 🙏

[@Fullasoul]

This was a HUGE help....thank you!!

[@big-ted4065]

After hours trying to use yaml with Minimalstic UI and getting no where and needing a lie down, 45 minutes of following your guide I had a fully working dashboard

[@lapoubelle77]

Oh man !!! Thanks for sharing your knowledge and making it easy for anyone to understand. I've loved your videos, since I discovered your channel a few months ago. Now I'm starving to see you do some coding on the other version.

[@EverythingSmartHome]

Too kind 🙏

[@FemiOsinowo]

Thanks for sharing this information - really helpful.

[@keeptalking100]

Really clear explanation - so helpful!

[@TimSheets]

wow! awesome video! thank you so much! I was playing with minimalist and struggling. This is much more my speed. :-)

[@micware2]

Fantastic channel! I learned so much from you. Thanks again for this beautiful and informative video. I can't wait to see what's next ;-)

[@Paladorys]

Woooo! Moar stuff to add to the list of tinkering to do.

[@EverythingSmartHome]

Haha sorry for that 😂

[@vpsrj]

Thanks for sharing your knowledge!

[@JealY666]

Thanks Lewis! Appreciate your work as always. Looking forward to the "hard" version.

[@EverythingSmartHome]

Appreciate the comment 🙏

[@johnperrone1963]

@@EverythingSmartHome Also looking forward to the "hard" version. I think the easy version for the most part looks just as good and is easy to put together, until I saw your LAB page. I feel like the Minimalist version of the LAB page looked 1000x better than the Easy version. I hope you will be sharing the code for that as one could almost just copy and past the yaml into that card page and just update some entities to basically duplicate the look and function. I mean it just looks really good.

[@clausheegaardpoulsen6698]

Simply brilliant. Many thanks.

[@realbryanc]

Great tutorial! I've had my own mobile dashboard for awhile, it worked, but it was just kind of "meh". I followed along to your whole video and love what i have now! Unless i missed it, i'd love to see another video about a desktop dashboard you have. I normally have Home Assistant always open on my web browser and definitely need some help beautifying that.

[@gianfilippocastagna3956]

Fantastico. Domani finalmente costruirò la mia prima dashboard. 🎉

[@sith8916]

Я живу в другой стране и только благодаря автопереводу смог смотреть это видео. Отличная видео, спасибо!

[@clairerovic]

Love it. Thankyou, it would have been a lot of work for you. Looking forward to all the possibilities this will now open up. So you know it was not to long, watched it before my work day.

[@ethanberg1]

This is amazing, Lewis! Thank you!!

[@eitelify]

Great video! Thank you :) The only thing I really changed was putting all the Mushroom cards into a bigger grid card to keep the alignment of the cards when using a desktop view, otherwise it's all over the place lol

[@EverythingSmartHome]

Thanks! Yes not a bad strategy at all;

[@wwolfram33]

This is a very useful video. It has taught me quite a bit and have referred to this content numerous times. Thanks!

[@real_christian]

Nice man! This really helped me to get started. Looks very nice on my smartphone. Kudos!

[@jsjiang6120]

I've got nothing to say except ... Thank you so much !!!