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
Commerce and product pages (Mobile)
Mobile packDomain
Mobile product pages: gallery, variant pickers, sticky add-to-bag bar, wishlist, reviews, size guide, delivery and listings.
- components
- 20
- variants
- 74
- recreations
- 3
- themes
- 5
Also for desktop: Commerce and product pages
What’s inside
Twelve product page patterns for phones: product gallery and detail screen, colour swatches and size options, a sticky add-to-bag bar, wishlist button and confirmation, review summary, cards and rating breakdown, a size guide sheet, delivery estimate, related products shelf, stays listing parts and a storefront top bar. Unavailable sizes and sale prices are shown with words and strikethrough.
- 20 sets across 12 product page patterns
- Adding, added and out-of-stock states on the sticky bar
- Size guide sheet in UK and EU sizes, cm and inches
- 3 recreations of real stays, sportswear and fashion apps
Product gallery
2 variants
- Images
- Loading
Product detail screen
2 variants
- In stock
- Low stock
Colour swatch
16 variants
- Default
- Selected
- Focus
- Unavailable
Size option
5 variants
Variant picker
3 variants
- Colour
- Size
- Size missing
Sticky add-to-bag bar
Free sample4 variants
- Default
- Adding
- Added
- Out of stock
Wishlist button
3 variants
- Off
- On
- Focus
Wishlist confirmation
2 variants
- Saved
- Removed
Review summary
2 variants
- Inline
- Card
Review card
2 variants
- Default
- Verified
Rating breakdown bar
10 variants
- Default
- Selected
Rating breakdown
2 variants
- None
- 5 stars
Size guide sheet
4 variants
- UK
- EU
- cm
- in
Delivery estimate
3 variants
- Standard
- Express
- Postcode needed
Related products shelf
2 variants
- Default
- Loading
Listing amenities
2 variants
- Short list
- With missing items
Host card
2 variants
- Default
- Top-rated
Reserve bar
3 variants
- Dates chosen
- No dates
- Unavailable
Category row
2 variants
- Women
- Men
Storefront top bar
3 variants
- Default
- Search open
- Scrolled
- Figma file
- SuperDuper Pack: Commerce and product pages (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 3 screen patterns
- Product detail, Listing detail and Reviews & ratings
How Airbnb, Nike and ASOS 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.
Stays listing
Recreated from Airbnb
Sportswear product
Recreated from Nike
Fashion product
Recreated from ASOS
Not affiliated with, endorsed or sponsored by Airbnb, Nike and ASOS. Their names are trade marks of their owners and are used only to say what each recreation is based on.
See the sticky add-to-bag bar full size, free
The sticky add-to-bag bar in default, adding, added and out-of-stock states. All 4 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
Notifications and inbox
Mobile9 components34 variants3 recreations
Mobile notification patterns: inbox rows, bells with counts, unread markers, activity and action rows, push previews and banners.
$9, or included with Pro
Questions about the commerce and product pages pack
One Figma file: SuperDuper Pack: Commerce and product pages (Mobile). It has 20 components with 74 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.