Command palette
Desktop11 components29 variants4 recreations
Desktop command palettes: Command K, nested pages, scoped tabs, preview, Ask AI, cheat sheet and quick switcher.
$9, or included with Pro
Commerce and product pages (Desktop)
Desktop packDomain
Desktop product galleries, buy boxes, variant pickers, quick view, carts, reviews, comparison tables and store headers.
- components
- 18
- variants
- 76
- recreations
- 3
- themes
- 5
Also for mobile: Commerce and product pages
What’s inside
Eight desktop commerce patterns in 18 sets: product gallery and buy box, colour swatches and size options, quick view card and dialog, cart line items and mini cart, review summaries and breakdown bars, a comparison table, admin media tiles and product editor, and a storefront header with mega menu. States cover low stock, out of stock, sale prices and unavailable sizes. Every page is documented in light and dark.
- In stock, low stock, out of stock and sale price states
- Product art placeholders, no photos or payment marks
- Recreations of Apple Store, ZARA and Shopify admin pages
Product gallery
3 variants
- Thumbnails
- Grid
- Loading
Buy box
Free sample6 variants
- In stock
- Low stock
- Out of stock
- Full
- Sale
Colour swatch
16 variants
- Sage
- Oat
- Ink
- Brick
- Default
- Selected
- Focus
- Unavailable
Size option
5 variants
- Default
- Hover
- Selected
- Focus
- Unavailable
Variant selector
3 variants
- Colour
- Size
- Size missing
Quick view product card
3 variants
- Default
- Hover
- Focus
Quick view dialog
2 variants
- Default
- Added
Cart line item
4 variants
- Quantity 1
- Quantity 2
- Updating
- Unavailable
Mini cart
3 variants
- Items
- Free delivery
- Empty
Review breakdown bar
5 variants
- 5
- 4
- 3
- 2
- 1
Review summary
2 variants
- Full
- Compact
Review
4 variants
- Default
- Verified
- With reply
- Long
Comparison table
4 variants
- Two
- Three
- Highlight off
- Highlight on
Admin media tile
5 variants
- Default
- Hover
- Focus
- Uploading
- Add
Admin product editor
3 variants
- Draft
- Active
- Unsaved
Storefront nav link
4 variants
- Default
- Hover
- Current
- Focus
Mega menu
1 variant
Storefront header
3 variants
- Default
- Search focus
- Menu open
- Figma file
- SuperDuper Pack: Commerce and product pages (Desktop)
- 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 Apple Store, ZARA and Shopify admin 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.
Device store buy page
Recreated from Apple Store
Fashion product page
Recreated from ZARA
Commerce admin product
Recreated from Shopify admin
Not affiliated with, endorsed or sponsored by Apple Store, ZARA and Shopify admin. Their names are trade marks of their owners and are used only to say what each recreation is based on.
See the buy box full size, free
A product buy box in stock, low stock and out of stock, each at full and sale price. All 6 variants, free to see with a SuperDuperUI account. The Figma file comes with the pack.
More domain packs
Notifications and inbox
Desktop8 components36 variants4 recreations
Desktop notification bell and popover, inbox page, row types, snooze, preferences matrix, email digest and empty inbox.
$9, or included with Pro
Uploads, capture and files
Desktop14 components52 variants3 recreations
Desktop upload and file patterns: drop zones, file rows, browsers, previews, croppers, CSV import, exports and storage meters.
$9, or included with Pro
Questions about the commerce and product pages pack
One Figma file: SuperDuper Pack: Commerce and product pages (Desktop). It has 18 components with 76 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.