Components

Empty State

Mixed (Card+Icon)

Display an empty state when there is no content to show.

Basic Example

Simple empty state with icon, title, description, and action.

No items found
You don't have any items yet. Create your first item to get started.

No Search Results

Empty state for search or filter results.

No results found
Try adjusting your search or filter to find what you're looking for.

No Data Available

Empty state without action button.

No data available
There is no data to display at this time.

Installation

npx shadcn-svelte@latest add empty

API Reference

Components

Component
Description
Empty.Root
Container component
Empty.Header
Header section
Empty.Media
Icon or image container
Empty.Title
Title text
Empty.Description
Description text
Empty.Content
Action buttons container

Documentation

For more information, see the official shadcn-svelte documentation.