Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Empty - No Search Results
A React no search results empty state with Search icon showing helpful message about trying different keywords
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Search failures frustrate users—empty results need constructive guidance. This React empty state uses shadcn/ui Empty component with Search icon from Lucide React featuring No results found title and suggestion to try different keywords. Built with EmptyMedia variant icon providing search-specific messaging. The no search results pattern redirects users—perfect for search interfaces, product catalogs, documentation sites, or anywhere queries might return empty requiring user guidance toward successful searches.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
No Matches Found
Search empty with View All Items action
Try Different Keywords
Search empty with category suggestions
No Filter Results
Filtered search with Clear Filters action
Empty Table
Empty data table state
Input Component
Search input field
Card Component
Search results container