Skip to main content

Frontend design

We maintain a design portal at https://design.home-assistant.io that provides information about various frontend aspects such as:

  • UI components that can be reused.
  • Dashboard cards in various configurations and states.
  • Easy way to compare components and cards between light and dark themes.
  • Notes about specific wording in Home Assistant.

When new components or features are added to the frontend, those need to be added to the design portal. This portal page explains the details on how to do so: https://design.home-assistant.io/#design.home-assistant.io/editing

note

While the portal is publically named "design", it is referred to as "gallery" in the frontend repository. That is why the script to run the gallery locally in your development environment can be found at gallery/script/develop_gallery and the source code in gallery/src. ::