Infinite Scroll List
An intersection observer loads the next batch and states clearly when it ends
Mobile app · Page 2
Mobile app: 51 designs across 7 families — Page 2 of 3 — App bars · App cards · Floating action buttons · App lists · App search · Sheets · Tab bars
Designs — Page 2 of 3
Pull-to-Refresh List
Increasing resistance, a release threshold, and a spinner that announces state
Reorderable List
Drag by the handle, with an arrow-key path as the alternative
Sectioned List with Side Index
Sticky headers and a letter index that jumps to its section
List with Loading Skeleton
The skeleton matches the real content’s size so nothing shifts on arrival
Action Sheet
Grouped actions with the destructive one separated and marked
Irreversible Confirm Sheet
Requires typing a confirmation word before the button activates
Bottom Sheet with Detents
Third, half and full — it settles at the nearest detent on release
Filter Sheet
Changes stay pending until Apply — Reset restores the last applied state
Payment Method Sheet
Each method carries its fee, and the total recomputes on switch
Wheel Picker Sheet
Wheels snap on scroll and the value is read from the position
Share Sheet Grid
A row of people, a row of actions, and a copy-link that actually copies
Icon that Expands into Search
A small icon opens a full bar and closes it on Escape
Search with Filter Chips
Horizontally scrolling chips narrow the result, with a counter that follows
Sticky In-list Search
Sticks to the top of the list on scroll and reports the match count
Floating Search over a Map
Floats above the map with results sliding out beneath it
Search with Multiple Inputs
Type, scan a code, or use location — three ways into one result
Full-screen Search Sheet
Tapping the bar opens a search screen with history and trending
Search with Keyboard Suggestions
Live suggestions navigable with arrows and accepted with Enter
Tab Bar with Count Badges
The badge caps at 99+ and the total is summed from the conversations
Tab Bar with Centre Action
Four tabs with one raised primary action in the middle
Dot Page Indicator
Follows the horizontal swipe and jumps when a dot is pressed
Icon and Label Tab Bar
Five items maximum, each with an accessible name and a sliding indicator