Form fields
Mobile28 components208 variants5 recreations
Mobile form fields with error and success states, each paired with the right iOS or Android keyboard.
$9, or included with Pro
Search (Mobile)
Mobile packActions and input
Mobile search screens from the search bar to results: recents, suggestions, scopes, voice, explore and filters.
- components
- 11
- variants
- 34
- recreations
- 4
- themes
- 2
Also for desktop: Search
What’s inside
11 search patterns: an inline bar, search in the nav bar, a recents panel, typeahead suggestions, scopes, mixed results, no results with did you mean, voice search, recent history, an explore grid and filtered results. Suggestions mark the match by weight, and recent rows can be removed. Every page has a documentation frame and a live grid in Light and Dark, Comfortable and Compact.
- Voice search: ready, listening, heard, no permission
- No results with did you mean and filter hints
- 4 recreations from Spotify, Airbnb, Instagram and Uber Eats
Inline search bar
3 variants
- Page top
- In content
- In a card
Search in nav bar
3 variants
- Large title
- Scrolled
- Replaces title
Recents panel
3 variants
- Recents
- Mixed recents
- No recents
Search suggestions
Free sample3 variants
- Queries
- With entities
- Loading
Search scopes
4 variants
- Top
- People
- Places
- Tags
Mixed results
2 variants
- Top result
- Grouped
No results
3 variants
- No match
- Did you mean
- Filters hide results
Voice search
4 variants
- Ready
- Listening
- Heard
- No permission
Recent searches
3 variants
- List
- Row removed
- Cleared
Explore grid
3 variants
- Category tiles
- Media grid
- Trending
Filtered results
3 variants
- None
- One
- Several
- Figma file
- SuperDuper Pack: Search (Mobile)
- Themes
- Light and Dark
- Densities
- Comfortable and Compact
- Also in the file
- Usage and accessibility notes, motion specs, Figma variables
- Covers 1 UI element and 2 screen patterns
- Search bar, Search (empty / suggestions) and Search results
How Spotify, Airbnb and Instagram and others do it
Recreations of real products, so you can compare approaches side by side. They are approximate, built from public product knowledge, with placeholder data and no third-party artwork.
Music search
Recreated from Spotify
Stays search
Recreated from Airbnb
Photo explore
Recreated from Instagram
Food delivery search
Recreated from Uber Eats
Not affiliated with, endorsed or sponsored by Spotify, Airbnb, Instagram and Uber Eats. Their names are trade marks of their owners and are used only to say what each recreation is based on.
See the search suggestions full size, free
Typeahead suggestions with plain queries, with people and places, and while loading. All 3 variants, free to see with a SuperDuperUI account. The Figma file comes with the pack.
More actions and input packs
Selection controls
Mobile19 components216 variants3 recreations
Mobile switches, checkboxes, radios, sliders, steppers, ratings and swatches, each with every state drawn and documented.
$9, or included with Pro
Chips, tags and badges
Mobile12 components40 variants3 recreations
Mobile chips and badges: filter, choice, input, action and category chips, plus status, count, dot and verified badges.
$9, or included with Pro
Questions about the search pack
One Figma file: SuperDuper Pack: Search (Mobile). It has 11 components with 34 variants, 4 recreations, and notes on when to use each part. Everything uses Figma variables, so you can change the colours and type to match your product.