An empty state is a situation in which a container, such as an editor, a table, or list, has no content to display.  There are a few reasons why this could happen. For example, there could be connection issues, or the user might be seeing the container for the first time and needs to do something to make the content appear.

Do

• Explain the situation to the user. Explain what the user should be seeing, and why the content isn’t there.
• If user action is required, provide instructions or a link to where the information can be found.
• In editors or panels, include an image with the provided information. You can use the image below (by saving it locally) or create your own images.

Don’t

• Don’t show an empty container.

Visual Design