Kiosk mode in Home Assistant is useful if you want to run Home Assistant on a tablet on the wall. It is also useful if you only want to give certain people in the house access to one dashboard and you want to hide the top and side menus. In this tutorial, I will show you how to set up kiosk mode in Home Assistant and how you can quickly switch between kiosk mode and normal mode yourself by means of shielded buttons on your dashboard. Let’s get started right away!

---

⭐⭐⭐ NOTE: ⭐⭐⭐

This article accompanies a YouTube video. I wrote it for people who would rather read than watch a video. To keep doing this, I want to ask you to check out the video, leave a comment under the video, give the video a thumbs up, and subscribe to my YouTube channel. This means that the video is offered more often to new visitors so that they also stay informed of the latest Home Assistant tutorials.

Thank you for your support!

Ed

Watch the video here

---

You can set up Kiosk mode in Home Assistant and then show it on a browser. If you want to do that beautifully, you can use Fully Kiosk Browser for Android for this, for example. With the help of Fully Kiosk, you can actually lock the screen, so you can’t just go back to other functions of your tablet.

In this Home Assistant tutorial I’ll show you two things:

1. How do I activate Kiosk Mode in Home Assistant?
2. How can I easily switch between Kiosk mode and normal mode?

Activating Kiosk Mode in Home Assistant.

To activate Kiosk mode we are going to install a HACS integration. If you haven’t installed HACS yet, you can do so by watching my video about it. The link is in the description below.

The Kiosk Mode integration is maintained by Steven Koeberich since it was removed a couple of weeks back, so thanks Steven for forking this! The integration has several options. You can view the options yourself in the manual. In this tutorial, I’m just going to show you my best practice on how to apply Kiosk mode. You can adjust that to your own taste of course.

1. First, we go to HACS. Then we click on “Frontend”.
2. Then we click on “Explore & Download Repositories”
3. Search for “Kiosk Mode”
4. Click on Kiosk Mode
5. Click “Download” and click “Download” again
6. Now click on “Reload”

Activate Kiosk Mode

Now the Kiosk mode integration is installed in Home Assistant. Let’s activate it!

To do this, we go to the dashboard for which we want to turn on the Kiosk mode.
In this dashboard, we click on the three dots at the top right and then on “Edit Dashboard”.
Then we click on the three dots again and choose “Raw configuration editor”

You will now see the YAML code of our dashboard. You may find this a little intimidating, but if you follow this tutorial, it’s not that bad. What is very important in YAML is that you make sure that the indentation of spaces is correct. So keep that in mind when adding code.

The code used in this video can be downloaded here.

What we have done now is that we have turned on kiosk mode for everyone who is not an administrator of Home Assistant. So, if you set other family members not to be “Admin”, they will see this dashboard as a Kiosk Dashboard.

Note:

I use Mushroom cards and the Navigate tap action to navigate between different tabs. If you use kiosk: true, the tabs are not shown anymore. If you’d like your tablet to still show the tabs in a dashboard, then you can use hide_header: false and hide_sidebar: true instead of kiosk: true.

Now click on Save and then click on the cross on the left above the dashboard.

Now click on Done.

You will see that nothing seems to have changed. This is, of course, because you are an Administrator and we have just set up kiosk mode for anyone who is not an administrator.

If I log in as someone who is not an administrator, you will see that person no longer sees any menus. Now I’m going to explain to you how to make that happen!

Add buttons to turn “Kiosk Mode” on or off in Home Assistant.

Now I’m going to do a trick by creating a helper and based on the value in that helper we’re going to turn the “Kiosk Mode” on or off.

Create a Helper

1. Go to Settings and then Devices & Services.
2. Then click on “Helpers”
3. Click “Create helper”
4. Choose “Toggle”
5. Name the helper “Kiosk Mode” and Create the helper. I already created that helper, so I don’t need to create it again.

Now we are going to create the buttons on our dashboard that turn the kiosk mode on or off. I use mushroom cards for this. If you don’t have this, you can also install it via HACS, but you can also use a standard entities card for this.

Now go back to the dashboard where you added the “Kiosk Mode” code.

Create the buttons

1. Click on the three dots at the top right
2. Click on “Edit Dashboard”
3. Click on “Add Card”
4. Add a “mushroom chips card”
5. Delete the first “Entity”
6. Click on “Add Chip” and select “Menu”
7. Click on “Add Chip” again and select “Action”
8. Click on the pencil next to “Action”
9. Select an icon. I choose “mdi:arrow-expand-vertical”
10. Select an icon color. I choose “Light Green”
11. Click Tap Action
12. Select “Call Service”
13. At Service, choose “Input boolean: Toggle”
14. Choose the entity Kiosk Mode
15. Click Save
16. Put your Menu at the top.
17. Click Done

Oh, by the way, I also use the layout card in HACS by Thomas Lovén, which gives you more control over the layout of your dashboard. This is also recommended to install. Search for “layout card” in HACS. This allows you to adjust the “View type” of your dashboard. I have it set to “Vertical (layout-card)” here. It’s out of scope for this tutorial, but you can install it anyway.

Test the buttons

You now see that when I press the menu icon, the menu is expanded or collapsed. On a desktop, you see that the menu will still remain visible for now. That is not the case on mobile. You can change that later so that the menu is not visible on a desktop either.

Make the fold-out button work

The green fold-out button doesn’t do anything yet. At least what it does is convert the value of the “Kiosk Mode” helper from on to off and vice versa. But he doesn’t turn “Kiosk Mode” on and off yet. To do that, let’s go to the three dots at the top right again.

1. Click on “Edit Dashboard”
2. Click again on the three dots at the top right
3. Click on “Raw configuration editor”
4. Now replace the kiosk code you added with this code

The code used in this video can be downloaded here.

5. Click Save
6. Click on the cross at the top left of your dashboard.
7. Click on Done
8. REFRESH YOUR BROWSER! This is important, otherwise, it won’t work the first time!

The code toggles the hide_header to true or false based on the input_boolean.kiosk_mode. You will now see that the green button toggles “Kiosk mode” on and off if you are an administrator. If you’re a user, that button and the menu button don’t do anything.

Now, of course, we don’t want the user to see those buttons, so we’re going one step further.

Hide buttons based on the user’s role.

To show certain dashboard buttons based on the user’s role, we need a different HACS integration.

This integration is called State Switch and was created by Thomas Lovén. Using this integration, you can enable or disable “cards” on your dashboard based on a certain status. It has several options that you can view in the integration manual. For our use case we now only use the control on a group. It can have the value “user” or “admin”. It’s a pretty powerful integration, so if you want to learn more about it, be sure to read the manual.

By the way, you should really check out all the integrations that Thomas Lovén created. They are totally awesome. The link to his GitHub is in the description below.

Install the State Switch Integration

1. For this we go back to HACS.
2. Click on “Frontend”
3. Click on “Explore & Download Repositories”
4. Search by state switch
5. Click State Switch
6. Click “Download” and then click “Download” again
7. Then click on “Reload”

Apply the State Switch integration

The “State Switch” integration is now installed. Let’s apply it to our “Kiosk Dashboard”.

For that, we go back to our “Kiosk Dashboard”.

1. Click on the three dots at the top right
2. Click on “Edit dashboard”
3. Now click on “Edit” in your chips card
4. The state switch entity currently does not have a GUI, so we need to add the code in YAML. Thomas Lovén wants to make a GUI for that, but there is no planning for it yet. So, for now we are going to add the code in YAML.
5. Click Show Code Editor
6. Replace the code in the code editor with this code:

The code used in this video can be downloaded here.

7. I changed the Action Chips card to the Template chips card here so that the expand and collapse icons differ.
8. Click Save
9. Click “Done”

What we have now done is that we have indicated that the two buttons should only be shown if someone is “Administrator”.

Let’s test it. Exciting!

As you can see, I see the buttons because I am “Administrator”.
Now when I log in as a user who is not an “Administrator”, I don’t see those buttons and I am locked in this Dashboard and can’t access anything else.

I did the same for the two buttons “Stats” and “Server” that are on the dashboard. They are also only visible to people with the “Administrator” role.

With the help of the “State Switch” integration you can do a lot more things and even show cards only for specific users. I think you can now make this yourself based on the information in this tutorial.

So, now you can create the “Kiosk Mode” yourself for your tablet or for your other family members. Let me know in the comments. I hope it was of some use to you. and I want to thank everyone who has supported me in making these videos so far. I could never have done this without you. Thank you!

Oh, don’t forget to give this video a thumbs up, subscribe to my channel, and hit the notification bell.

See you soon!

Bye bye!