Important: We now recommend using the official shadcn/ui + Base UI setup for new projects.Learn more
basecn
Components

Empty

Use the Empty component to display a empty state.

No Projects Yet
You haven't created any projects yet. Get started by creating your first project.
Learn More

Installation

pnpm dlx shadcn@latest add https://basecn.dev/r/empty.json
or

If you are using a namespaced registry, you can use the following command:

pnpm dlx shadcn@latest add @basecn/empty

Examples

Outline

Use the border utility class to create an outline empty state.

Cloud Storage Empty
Upload files to your cloud storage to access them anywhere.

Background

Use the bg-* and bg-gradient-* utilities to add a background to the empty state.

No Notifications
You're all caught up. New notifications will appear here.

Avatar

Use the EmptyMedia component to display an avatar in the empty state.

LR
User Offline
This user is currently offline. You can leave a message to notify them or try again later.

Avatar Group

Use the EmptyMedia component to display an avatar group in the empty state.

CNLRER
No Team Members
Invite your team to collaborate on this project.

Input Group

You can add an InputGroup component to the EmptyContent component.

404 - Not Found
The page you're looking for doesn't exist. Try searching for what you need below.
/
Need help? Contact support

On this page