Y2K UI

Empty

An empty state placeholder for when no data is available.

empty-demo.app

No results found

Try adjusting your search terms or filters.

Installation

terminal.sh
npx y2kui@latest add empty

Usage

import { Empty } from "@/components/ui/empty"

<Empty
  icon={<InboxIcon />}
  title="No messages"
  description="You have no unread messages."
  action={<Button>New message</Button>}
/>

Props

PropTypeDefaultDescription
iconReactNodeIcon displayed above the title.
titleReactNodePrimary heading text.
descriptionReactNodeSupporting description.
actionReactNodeCall-to-action element.
childrenReactNodeAdditional custom content.
classNamestringAdditional Tailwind classes.

On this page