Home Assistant dashboard – how to build a clear control panel

The dashboard is the part of Home Assistant that users interact with most often. It shows the state of the home, lets you control devices, run specific actions, and quickly reach the information needed at a given moment.

Home Assistant can prepare a basic panel automatically, but a custom dashboard gives you much more control over what is visible, in what order, and how users can control the system.

A simple panel can be prepared without writing code. However, when you add different views, a phone, a wall-mounted tablet, conditionally displayed elements, custom navigation, non-standard cards, or more advanced actions, the configuration quickly becomes more extensive.

This guide explains how a Home Assistant dashboard is structured, how to create your own panel from scratch, and which options can be used in more advanced layouts.

Home Assistant includes built-in dashboards that can automatically present devices and information available in the system.

If you need your own layout, creating a separate dashboard is a better solution than rebuilding the basic view solely to adapt it to a particular phone, tablet, or way of using the home.

You can create a new dashboard through:

Settings → Dashboards → Add dashboard

If the panel is to be completely custom, choose:

New dashboard from scratch

which creates an empty dashboard.

During creation, you can give it a name and icon and decide whether it should be visible in the Home Assistant sidebar.

Options with preconfigured elements are also available. For a custom panel built around a specific way of using the system, an empty dashboard gives the greatest control over the later layout. Home Assistant officially supports multiple separate dashboards and recommends creating a new one for a more individual configuration instead of modifying the basic panel.

These terms are easy to confuse.

A dashboard is the entire control panel.

A view is a tab inside a dashboard. One dashboard can, for example, have separate views for the ground floor, upper floor, heating, energy, or media.

A card is a specific element placed in a view. It can represent a light, temperature, thermostat, graph, weather, button, entity list, or other information.

An example structure could look like this:

Dashboard “Home” → view “Living room” → light card, temperature card, and media card.

This division means that you do not need to place every device and piece of information on one screen.

Home Assistant provides four basic view types:

Sections – currently the default view type. It divides a dashboard into sections and arranges cards in a grid. It works well for panels that should retain an orderly layout across different screen widths.

Masonry – arranges cards in columns according to their size. It can be convenient for panels made up of cards with different heights.

Panel – assigns practically the entire view to a single card. It is useful, for example, for a large map, image, or another element intended to occupy all available width.

Sidebar – creates a two-column layout with a wide main area and a narrower area at the side.

The view type affects not only appearance but also how cards later behave on different screens. There is no need to use the same view type in every part of a dashboard.

In a Sections view, cards can be grouped into logical sections.

For example, a dashboard can contain:

• a lighting section,
• a temperature and heating section,
• a blinds section,
• a security section,
• a media section.

This does not mean that every category needs its own block. The division should follow the way the panel is used.

In Sections, you can also change the size of cards in the grid. A more important element can therefore occupy more space, while a simple status or button takes less.

However, it is not worth filling all available space simply because it is possible. A dashboard should primarily make it quick to find information or a function.

After entering dashboard edit mode, you can add a card in two basic ways.

The first method is to select an entity. You indicate the entity you want to show, and Home Assistant suggests a suitable way to present it.

The second method is to select the card type. First choose the kind of element, then specify which entities or data it should contain.

Depending on your needs, you can use cards for, among other things:

• controlling lights,
• presenting sensors,
• operating a thermostat,
• displaying weather,
• showing graphs,
• grouping entities,
• creating buttons,
• displaying images,
• presenting webpages.

Home Assistant also lets you add a card directly from device information and choose the dashboard and view where it should be placed.

The integration of a single device can create many entities. This does not mean that every one of them should be shown on the main dashboard.

A screen used every day should primarily contain information and functions that are genuinely needed on a regular basis.

For example, the main panel can show room temperature and heating controls, while technical diagnostic sensors for the device do not need to occupy space next to them.

Likewise, dozens of battery-level entities can be placed in a separate technical view instead of being mixed with everyday lighting and blinds controls.

More data on the screen does not always mean a better dashboard. If the most important information is lost among elements used once every few months, the panel no longer fulfils its basic purpose.

On many cards, you can define what should happen after a user interaction.

Home Assistant distinguishes, among others:

• tap – a normal tap or click,
• hold – pressing and holding,
• double tap – tapping twice.

Depending on the configuration, you can, for example:

• toggle a device state,
• open detailed information,
• perform a specific action,
• navigate to another dashboard view,
• open a URL,
• start Assist.

A single card can therefore serve not only as a simple button but also as a navigation element or an entry point to more detailed controls.

However, avoid assigning many hidden actions without a clear need. If a user does not know that holding a button performs a different operation from tapping it, the panel can become less intuitive rather than more functional.

Home Assistant lets you define card visibility conditions.

For example, information about an open window can appear only while the window is actually open, and an element related to charging a car can be visible only while the charger is in use.

You can also restrict the visibility of elements to specific users.

This reduces the amount of information displayed at once and allows some elements to appear only when they become relevant.

Conditional visibility should not replace automation. The fact that information appears on the screen does not mean that the user should have to react manually every time.

Home Assistant also provides a Webpage dashboard.

It is not another way to build the same panel from Home Assistant cards. Its purpose is to embed a webpage inside the Home Assistant interface.

This can be, for example:

• a page available on the internet,
• the panel of a device on the local network,
• a NAS or router interface,
• your own local webpage,
• another interface that can be embedded correctly.

The Webpage dashboard uses the Webpage card.

Not every website allows embedding. Some services block operation in a frame for security reasons. In addition, Home Assistant accessed through HTTPS cannot embed a page that is available only through HTTP in this way.

A Webpage dashboard is an entire dashboard intended to present a webpage.

A Webpage card is a card that can be used as an element of a dashboard.

This lets you embed a page in a selected place in the interface instead of dedicating an entire separate panel to it.

A Webpage card can also display files stored locally in the Home Assistant www directory and exposed through the /local/ path.

Browser security restrictions still apply. The fact that a page opens normally in a separate browser tab does not mean that it can also be embedded in a dashboard.

A dashboard that is convenient on a large monitor will not always be convenient on a phone.

On a phone, quick access to the most frequently used functions, suitable card widths, and avoiding elements that require horizontal scrolling are important.

A wall-mounted tablet provides more room and can show the state of the home, lighting controls, weather, alarm, and temperature at the same time.

Home Assistant supports multiple dashboards, so you can prepare a separate panel for a tablet instead of trying to fit every use case into one layout.

If the wall tablet should use a different default dashboard from the user’s phone, you can also create a separate user profile for the tablet and assign the appropriate dashboard to it.

The person configuring Home Assistant may want to see technical states, diagnostics, battery levels, network information, and additional sensors.

Other household members may primarily need simple controls for lights, blinds, temperature, the alarm, or media.

There is no need to place these two ways of using the system on one screen.

Separating the everyday panel from the technical view often simplifies operation and reduces the risk of accidentally activating functions that are not needed in daily use.

A good dashboard makes it possible to control the system and manually correct its operation.

However, if every evening a user has to turn off several lights, lower the blinds, change the temperature, and switch several devices manually, the problem should not always be solved by adding more buttons to the panel.

Some of these tasks may be better suited to an automation or a script.

The dashboard can then contain one appropriate function or simply show the result of the system’s operation.

Home Assistant automations →

Home Assistant has many built-in cards, and they are sufficient for a large proportion of panels.

There are also custom elements created by the community. They can extend the dashboard’s appearance, add other ways to present data, or enable solutions that are not available in standard cards.

HACS is often used to download and update such elements. HACS supports community-created dashboard elements, including custom cards and other interface components.

This does not mean that every dashboard should be built from custom cards.

Every additional community element is another dependency that later needs to be updated and checked for compatibility with new Home Assistant versions.

It is therefore worth first checking whether the required result can be achieved using the standard features.

No. A typical dashboard can be built through the graphical Home Assistant interface.

You can add views, cards, and entities, resize them, and configure many behaviours without manually creating the entire YAML configuration.

YAML can still be useful for more technical solutions, manual editing of card configurations, or when the dashboard is to be managed in configuration files.

Home Assistant also allows separate YAML dashboards to be defined. This is a more advanced way to manage a panel and is not required to start working with dashboards.

YAML is not a “better” solution. It is an additional level of control that makes sense in particular configurations.

You can start an example panel by creating a new, empty dashboard.

Then:

• create the first Sections view,
• divide it into several logical sections,
• add the most important entities used every day,
• choose cards that suit the way the devices are controlled,
• set the sizes of the most important elements,
• remove technical information that is not needed every day from the main view,
• if you need more information, create another view instead of overloading the first one,
• configure card actions only where they genuinely make operation easier,
• use conditional visibility for information needed only in specific situations,
• check the panel on both a computer and a phone.

Only after building a clear foundation is it worth considering additional community cards, your own YAML, or more extensive navigation.

If the panel will run on a fixed tablet, test it directly on that device as well. A layout that looks correct in a desktop browser window may not behave identically on a screen with different proportions.

At first, a dashboard often contains a few lights, temperature, and blinds.

As the system grows, more sensors, devices, graphs, media, alarm information, energy data, batteries, and diagnostic elements are added.

If every new element is placed on the same screen, finding a particular function eventually starts taking longer than using it.

Instead of adding more cards to one view, it is worth defining a hierarchy:

• the most important information first,
• everyday controls in easily accessible places,
• less frequently used functions in separate views,
• diagnostics away from the main screen.

The panel should not be a catalogue of every Home Assistant entity. It should be an interface prepared for a specific way of using the system.

A basic panel with a few cards can be prepared relatively quickly.

More planning is required when the panel should:

• work well on several different screens,
• provide separate views for different users,
• hide and show elements according to the system state,
• navigate between many views,
• use custom actions for tapping and holding,
• present external webpages or local interfaces,
• use custom cards,
• combine controls with automations and scripts,
• retain a consistent appearance despite a large number of devices.

In this situation, the dashboard stops being just a collection of buttons. It becomes a separate user interface whose layout needs to be planned in much the same way as the logic of the rest of the system.

If you want to see an example of a more advanced Home Assistant panel, you can open the prepared demo.

View the Home Assistant demo →

A Home Assistant dashboard can be a simple screen with a few essential functions or an extensive interface prepared for a phone, tablet, and different users.

What matters most is not how many cards can be placed on the screen, but whether the required information or function can be found and understood quickly.

It is worth starting with a simple layout, dividing the panel into logical views and sections, and only then adding conditional visibility, additional actions, HACS, a Webpage dashboard, or YAML configuration.

If the dashboard becomes harder to use with every additional card, reorganising its structure is a better solution than continuing to add more elements.

If you want to build a panel from scratch, organise your current dashboard, prepare a convenient layout for a phone or tablet, or implement a more advanced setup, I can help plan the structure and configure a solution suited to how you use the system.

Contact me.The initial assessment of your request is free and without obligation. → click here