Skip to content 
Empty state - CSS Component
The EmptyState component can be used imported from:
Playground
Construction
The CSS component uses a <section> tag, with the z-empty-state HTML custom attribute.
z-empty-state
The z-empty-state attribute is the main attribute used to render the empty state CSS component.
Inside the <section> tag, you can add the following elements:
title- The header of the empty state using the<h3>tag.description- The content of the empty state.button- The button to add an action to the empty state.
Empty state header
Empty state content
Also you can add an illustration or a pictogram. Using the image component or the pictogram component respectively.
Empty state header
Empty state content
Browser support
Detected engine:
Chromium
Webkit
Gecko