πŸ“„ tailwindcss/plus/ui-blocks/application-ui/feedback/empty-states

File: empty-states.md | Updated: 11/15/2025

Source: https://tailwindcss.com/plus/ui-blocks/application-ui/feedback/empty-states

5-day Mini-Course

Build UIs that don’t suck.

Short, tactical video lessons from the creator of Tailwind CSS, delivered directly to your inbox every day for a week.

Get the free course

Empty States

Use these Tailwind CSS empty state components to gracefully handle scenarios where no data is available, guiding users towards the next steps or actions to take. These components are designed and built by the Tailwind CSS team, and include a variety of different styles and layouts.

Simple


Preview

Get the code β†’

Simple


Preview

Get the code β†’

With dashed border


Preview

Get the code β†’

With dashed border


Preview

Get the code β†’

With starting points


Preview

Get the code β†’

With starting points


Preview

Get the code β†’

With recommendations


Preview

Get the code β†’

With recommendations


Preview

Get the code β†’

With templates


Preview

Get the code β†’

With templates


Preview

Get the code β†’

With recommendations grid


Preview

Get the code β†’

With recommendations grid


Preview

Get the code β†’