UX Patterns
Filtering
UXfilternavigationdatarefinement
Narrowing a content set based on one or more criteria, applied non-destructively.
When to use
- Collections large enough that browsing all items is impractical
- When users have a specific attribute in mind (tag, status, date range)
- Show active filters as removable chips so users can see and clear them
Examples
- Airbnb's filter bar (price, rooms, amenities)
- Linear issue filters by assignee, label, and status
See this in the wild
Analyze a site and look for filtering in the breakdown.