I found out recently about the webpage card in home assistant and how it can be used to add a WLED live view to your home assistant dashboard. Not only that, but its pretty simple to do as well!
We need to start out with the URL to the WLED control page. This can be grabbed from home assistant if you don’t know it off hand. The device page for WLED devices has a link to visit the control page.
With the URL in hand, we go to add our webpage element to the home assistant UI.
With the card selected, we drop in our URL to the settings and add “/liveview” to it. With that the preview will show up in the webpage card. The aspect ratio can be adjusted to your preference to make it thinner and more reasonable in the UI.
That’s all that’s needed to make a card showing the preview.
Note, this doesn’t work remotely, even over VPN. This also isn’t working through WallPanel for wall tablet controls.
Conclusion
I think this is a great way to add a bit of WLED flair to any control panels for it. It makes it easy to see whats currently going on across devices and strands. Not only that, but its simple to add to a Home Assistant dashboard as well!
Resources
Bonus! Advanced Cards!
As a little bonus, let’s use some of the more interesting cards. We’ll be using a vertical stack card and conditional card to have a WLED control and preview element
Once we have our vertical stack card, we add the light card on top for controlling WLED.
With the lighting card on top, we now add a conditional card. That card will have a condition on the light strip being on. The card to activate will then be our preview card from above.
The webpage card for the preview is setup the same as before.
We can now checkout the card in the UI. With the lights off, we have no preview.
With the lights on, we have the preview of the current effect.
