Wallets, transactions and money movement
Mobile13 components48 variants2 recreations
Mobile balances, amount entry, send and request, transactions, cards, exchange, payouts and savings goals screens.
$9, or included with Pro
Notifications and inbox (Mobile)
Mobile packDomain
Mobile notification patterns: inbox rows, bells with counts, unread markers, activity and action rows, push previews and banners.
- components
- 9
- variants
- 34
- recreations
- 3
- themes
- 5
Also for desktop: Notifications and inbox
What’s inside
8 notification patterns for phone apps in 9 sets: inbox rows, a bell with counts, unread markers, follow and request action rows, activity rows, push previews, in-app banners, empty states and filter chips. Unread shows as a dot, a heavier name and a tint together, never colour alone. Every page has a documentation frame, a live grid in light and dark, comfortable and compact, and a phone screen in context.
- Unread shown by dot, weight and tint, not colour alone
- Lock screen push previews for writing notification copy
- 3 recreations of photo, network and code app inboxes
Notification row
Free sample6 variants
- Unread
- Read
- Default
- Pressed
- Focus
Notification bell
4 variants
- None
- Dot
- Number
- Many
Unread marker
3 variants
- Dot
- Count
- New
Action row
4 variants
- Follow
- Request
- Following
- Accepted
Activity row
5 variants
- Like
- Comment
- Mention
- Review
- System
Push preview
3 variants
- Collapsed
- Expanded
- Stack
In-app banner
3 variants
- Message
- Mention
- System
Empty inbox
2 variants
- Caught up
- Turned off
Inbox filters
4 variants
- All
- Unread
- Mentions
- Follows
- Figma file
- SuperDuper Pack: Notifications and inbox (Mobile)
- Themes
- Light, Dark, Light high contrast, Dark high contrast and Wireframe
- Densities
- Comfortable and Compact
- Also in the file
- Usage and accessibility notes, motion specs, Figma variables
- Covers 1 screen pattern
- Notifications
How Instagram, LinkedIn and GitHub 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.
Photo app activity
Recreated from Instagram
Network notifications
Recreated from LinkedIn
Code inbox
Recreated from GitHub
Not affiliated with, endorsed or sponsored by Instagram, LinkedIn and GitHub. Their names are trade marks of their owners and are used only to say what each recreation is based on.
See the notification row full size, free
An inbox row, unread and read, in default, pressed and focus states. All 6 variants, free to see with a SuperDuperUI account. The Figma file comes with the pack.
More domain packs
Chat, messaging and calls
Mobile17 components71 variants4 recreations
Mobile chat list rows, message bubbles, receipts, composer, voice notes, media, reactions and call screens.
$9, or included with Pro
AI chat and prompt UI
Mobile13 components46 variants4 recreations
Mobile AI composers, streaming answers, sources, suggestions, voice mode, image grids, task progress and AI labels.
$9, or included with Pro
Questions about the notifications and inbox pack
One Figma file: SuperDuper Pack: Notifications and inbox (Mobile). It has 9 components with 34 variants, 3 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.