Empty States

Explore our empty state designs, offering visually appealing placeholders for areas without content or data.

Basic

A standard empty state layout for general purposes.

Live preview:
Basic Large

Empty state display with a basic large layout for placeholder content.

Live preview:
Basic Small

A compact version of the basic empty state for smaller areas.

Live preview:
Dashed Action

An empty state with a dashed outline and a call to action.

Live preview:
Image Title

An empty state featuring an image with a title.

Live preview:
Next Steps

This layout suggests the next steps a user can take.

Live preview:
No Results

Used to indicate when no results are found in a search or query.

Live preview:
Recommandations

A layout tailored for presenting recommendations or suggestions.

Live preview:
Title Action

An empty state layout with a title and a primary action.

Live preview:
Title Description

An empty state that combines a title with a descriptive text.

Live preview:
Title Description Action

An empty state that features a title, description, and an action button.

Live preview: