Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Empty - Clear Filters Suggestion
A React no filter results empty state with two actions for Clear All Filters and Browse All providing multiple recovery options
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Complex filters need flexible recovery—multiple actions accommodate different user preferences. This React empty state uses shadcn/ui Empty component with Filter icon from Lucide React featuring two horizontal buttons (Clear All Filters with RotateCcw icon, Browse All with outline variant) in flex gap layout. Built with multiple action pattern for filter management. The dual filter actions pattern maximizes recovery—perfect for advanced filters, faceted search, product catalogs, or anywhere heavy filtering might over-constrain requiring varied reset options.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
No Filter Results
Single Clear Filters action
No Matches Found
Search with View All action
Multiple Actions
Horizontal button layout pattern
Column Filtering
Table with filters
Button Component
Filter action buttons
Checkbox Component
Filter controls