Search
Clear
Feature
Accordion
Sections that expand on click to reveal additional content.
Anchor link
Clickable elements that scroll the page to a specific point.
Banner
Full-width promotional sections, often positioned by the main navigation.
CTA
Elements styled as buttons that are used to guide and direct users towards a desired action.
Calculator
Functionality to calculate or project the effect of changing variables e.g. loan repayment costs over time.
Carousel
Interactive sections that switch between different content or sections that scroll horizontally.
Cart/basket summary
A section to quickly summarise cart contents, often appearing as a modal.
Category shortcut
Clickable elements to quickly guide users to categories or sub-categories.
Chat
Functionality that allows for easy communication between users and customer support.
Colour options
Swatch elements to display and allow selection of colour options for products.
Compare
Functionality that allows for easy comparison of numerous products.
Configurator
Functionality that allows users to customise or configure different options for a product.
Content
Copy, imagery, video, graphics, and other visuals used to communicate with users.
Country/language selection
Allows users to switch between different regions and languages.
Cross-sell/up-sell
A section to promote additional products beyond what the user is currently looking at.
Data visualisation
Graphics such as charts that are used to visualise data and aid comprehension.
Date picker/calendar
Allows users to easily pick and book a date for a service, e.g. for deliveries or appointments.
Delivery
Content clarifying delivery details and functionality allowing users to choose a preferred method.
Dropdown
Clickable elements that expand to show multiple input options, e.g. delivery country selection.
Editorial
Content presented in a less conventional and more visually engaging and graphic style.
Error/confirmation prompt
Messaging to communicate the failure or success of a user action, e.g. incorrect passwords.
FAQ/help
Frequently asked questions and other supporting content to assist users with questions.
Featured products
Sections, content, or elements specifically used to promote certain products.
Filters/sort by
Allows users to specify a criteria to help them find products they're interested in.
Form
A combination of input fields to collect user data or feedback.
Hero
A large section, above the fold, used as a promotional space or greeting space for users.
Horizontal layout
Elements or sections displayed in a row structure.
Imagery
Photographic or graphic content, e.g. product images, annotated diagrams, gifs in PLPs.
Interactions
Animations or state changes that happen when a user clicks or hovers on an element.
Login/sign up
Functionality or content to support users logging-in or creating new accounts, e.g. password recovery.
Modal/pop-up
A section that appears overlapping the page, e.g. a newsletter sign-up prompt, a cart summary.
Navigation/menu
A global section that allows users to reach other pages of the website, e.g. hamburger menus.
Newsletter
A section prompting users to sign up to recurring newsletter.
Notification
An element containing copy that draws attention, alerts, and notifies users.
Payment
Content regarding payment or functionality to support the selection and use of different payment methods.
Personalisation
Content unique to different users or functionality that allows users to customise their own experience.
Product availability
Functionality and content helping users stay informed about the availability of products.
Progress/steps
Visual indicators of the current stage in a sequence of stages, e.g. checkout steps.
Promotion
Content or functionality used to support the promotion of particular deals or products.
Quantity selector
Allows users to select and edit the quantity of a product.
Quick add
Allows users to add a product to the cart without visiting the product details page.
Quickview
Allows users to see more information about a product without viewing the product details page.
Reassurance
Content used to reduce user concerns when making a decision, e.g. free delivery, free returns.
Reviews/social proof
Content used to promote trust in a product, e.g. Trustpilot review scores, user generated content.
Scroll indicator
An element used to prompt users to scroll down a page, e.g. an arrow, additional copy.
Search
Allows users to find content by entering keywords into a field.
Size/dimensions
Functionality or content to support users in picking the appropriate size of product.
Sticky
A property assigned to an element to fix it in place in reference to the viewport.
Store/pickup locator
Functionality that allows users to find their nearest store or product pickup location.
Structure/hierarchy
Refers to the organisation, arrangement, and relationship of the sections and elements of a page.
Tabs
Clickable elements that switch between different content sections.
Toggle
Clickable switches that alternative between two values.
Tooltip
Explanatory content that appears when hovering on an element.
Tutorial
Functionality or content to support the user onboarding or to teach users.
Video
Recorded video content embedded into pages.
Virtual try-on
Functionality that allows users to see how products look on themselves, e.g glasses try on.
Wishlist/save
Allows users to add items to a list and keep track of products they're interested in.
Page
Max Mara
Heart icon to save products for later
Desktop site
Product details
 page
Luxury
Imagery
Wishlist/save
New
Marcus
Account balance chart by month
Mobile app
Content/info
 page
Finance
Data visualisation
New
Mango
Sticky Menu
Desktop site
Global element
 page
Fashion
Navigation/menu
Sticky
New
Mandarin Oriental
A scroll driver on the homepage
Desktop site
Homepage
 page
Travel
Imagery
New
Maisons du Monde
Quick add feature
Desktop site
Content/info
 page
Home/DIY
Imagery
Quick add
New
Maisons du Monde
Load more button with progress bar
Mobile site
Product listing
 page
Home/DIY
Progress/steps
Structure/hierarchy
New
Madewell
Navigation to same category in opposite gender
Mobile site
Search results
 page
Fashion
Navigation/menu
Search
New
Madewell
Category push using videos and descriptions
Desktop site
Product listing
 page
Fashion
Category shortcut
Filters/sort by
Imagery
Carousel
New
Madewell
Menu split into genders by tabs
Mobile site
Global element
 page
Fashion
Navigation/menu
Tabs
New
Madewell
Product size with model height included
Mobile site
Product details
 page
Fashion
Dropdown
Imagery
New
Madewell
Two separate entries for men and women
Desktop site
Global element
 page
Fashion
Navigation/menu
New
Madewell
Annotations to describe key features
Desktop site
Category
 page
Fashion
Imagery
New
Made
A size selector as a selection option
Mobile site
Product details
 page
Home/DIY
Size/dimensions
New
Made
Use of tooltips for reinssurance
Desktop site
Product details
 page
Home/DIY
Reassurance
New
Made
Quickly and easily narrows down the product catalog
Desktop site
Product listing
 page
Home/DIY
Filters/sort by
Size/dimensions
New
Lyft
Main features within the thumb zone
Mobile app
Homepage
 page
Transport
Navigation/menu
New
Lulus
Out of stock notification
Mobile site
Product details
 page
Fashion
Size/dimensions
Product availability
New
Lulus
Free Shipping Progress Bar
Desktop site
Cart/basket
 page
Fashion
Delivery
Progress/steps
New
Lulus
Reinssurance in the checkout
Mobile site
Cart/basket
 page
Fashion
Reassurance
New
Lulus
Color swatches on the PLP
Desktop site
Product listing
 page
Fashion
Colour options
New
Lululemon
Horizontal slider for color swatches
Mobile site
Product details
 page
Fashion
Colour options
Carousel
New
Louis Pion
Sticky search engine in the header
Desktop site
Homepage
 page
Retail
Search
Structure/hierarchy
New
Lo & Sons
The navigation bar stays sticky
Mobile site
Global element
 page
Accessories
Navigation/menu
Sticky
New
Lo & Sons
Zoom icons on product images
Mobile site
Product details
 page
Accessories
Imagery
Interactions
New
Lo & Sons
Stars anchor to the review section
Mobile site
Product details
 page
Fashion
Reviews/social proof
New
Leroy Merlin
Breadcrumbs as cross-category navigation
Desktop site
Global element
 page
Home/DIY
Navigation/menu
New
Lenscrafters
Map moves dependant on shop details tile
Mobile site
Content/info
 page
Accessories
Store/pickup locator
New
Lemonade
Chat bubble style tooltip interactions
Mobile site
Form
 page
Finance
Form
Interactions
Tooltip
New
Le Monde
Trend topics displayed on the menu
Desktop site
Global element
 page
News/publications
Navigation/menu
New
Lacoste
Available colors in the PLP
Mobile site
Product listing
 page
Sport
Colour options
Size/dimensions
New
L'Oréal
Try it on' before purchasing
Desktop site
Content/info
 page
Beauty
Virtual try-on
New
Kickstarter
Progress bar used to jump between steps
Desktop site
Checkout
 page
Retail
Progress/steps
New
Kayak
Color-coded calendar indicates price ranges
Desktop site
Booking
 page
Transport
Date picker/calendar
New
Kayak
Side navigation expands and collapses
Desktop site
Global element
 page
Transport
Navigation/menu
New
Kayak
Coronavirus travel restrictions map
Desktop site
Content/info
 page
Travel
FAQ/help
New
Kayak
Quickly remove filters when no results
Mobile site
Search results
 page
Travel
Filters/sort by
Search
New
Kate Spade
Push promotion through PLP containers
Mobile site
Product listing
 page
Fashion
Imagery
Promotion
New
Joybird
Relevant cross-sells in the cart summary
Desktop site
Cart/basket
 page
Home/DIY
Cart/basket summary
Cross-sell/up-sell
Quick add
New
Joybird
Insurance cross-sell in the cart summary
Desktop site
Global element
 page
Home/DIY
Cart/basket summary
Cross-sell/up-sell
Modal/pop-up
New
Joybird
Recently viewed items tab in the cart
Desktop site
Global element
 page
Home/DIY
Cart/basket summary
Cross-sell/up-sell
Modal/pop-up
Tabs
New
Joybird
Key informations above the fold line
Mobile site
Product details
 page
Home/DIY
Structure/hierarchy
New
Joybird
Dynamic color and material selection
Desktop site
Product details
 page
Home/DIY
Colour options
Dropdown
Size/dimensions
New
JetBlue
The extras are displayed in a slider
Desktop site
Checkout
 page
Travel
Cross-sell/up-sell
Carousel
New
Jet
The details of shipping and delivery on the pdp
Mobile site
Product details
 page
Retail
Delivery
Modal/pop-up
New
Jet
Sticky CTA with the price
Mobile site
Cart/basket
 page
Retail
CTA
Sticky
New
Jet
Select different days for delivery
Desktop site
Cart/basket
 page
Retail
CTA
Delivery
New
Jet
A detailed category horizontal slider
Mobile site
Homepage
 page
Retail
Horizontal layout
New
Jet
Progress bar to show users progress
Mobile site
Cart/basket
 page
Retail
Cart/basket summary
Progress/steps
New
J.Crew
Displaying the filters
Desktop site
Product listing
 page
Fashion
Filters/sort by
New
Invision
Sticky secondary nav for blog content
Desktop site
Content/info
 page
Internet/tech
Navigation/menu
Sticky
New
Invision
Clear and defined dropdown menu
Desktop site
Global element
 page
Internet/tech
Dropdown
Navigation/menu
New
Invision
Newsletter sign-up slides in from above
Desktop site
Global element
 page
Internet/tech
CTA
Modal/pop-up
Newsletter
New
Interior Define
CTA next to cross-sell of the related category
Desktop site
Product details
 page
Home/DIY
Category shortcut
New
Hyundai
In-Page Navigation
Mobile site
Product details
 page
Automotive
Navigation/menu
New
Hulu
Easy comparison of subscription options
Desktop site
Subscription
 page
Entertainment
Compare
New
Hubspot
Toggle between annual and yearly subscription options
Desktop site
Subscription
 page
Internet/tech
Compare
Toggle
New
Hubspot
Chatbot with FAQs and support questions
Desktop site
Global element
 page
Internet/tech
Chat
FAQ/help
New
Hubspot
Tabs break details into use cases
Desktop site
Product details
 page
Internet/tech
Content
Tabs
New
Hubspot
Horizontal tabs for comparison
Desktop site
Subscription
 page
Services
Compare
Horizontal layout
New
HSBC
One column form to facilitate the completion
Desktop site
Subscription
 page
Finance
Form
New
Honeybook
Prompts users to FAQs before chat
Desktop site
Global element
 page
Services
Chat
FAQ/help
New
Honeybook
Onboarding steps for first time users
Desktop site
Homepage
 page
Services
Progress/steps
Tutorial
New
HONDA
3D product image with ability to rotate and configure
Desktop site
Configurator
 page
Automotive
Configurator
Imagery
New
Hollister
Category push within cart's empty state
Desktop site
Cart/basket
 page
Fashion
Category shortcut
New
Hollister
Quickview from the list page
Desktop site
Product listing
 page
Fashion
Quick add
Quickview
New
Heyday
Product info on hover
Desktop site
Product listing
 page
Beauty
Imagery
Interactions
Quickview
New
HBO
Highlight new product in the header
Desktop site
Homepage
 page
Entertainment
Hero
Structure/hierarchy
New
Hayneedle
Sticky sub-navigation to anchor sections
Desktop site
Product details
 page
Home/DIY
Navigation/menu
Sticky
New
Harrods
Redirecting links in the error page
Desktop site
Error
 page
Fashion
Error/confirmation prompt
Navigation/menu
New
Harrington
Filters remains sticky on the left hand side
Desktop site
Product listing
 page
Fashion
Filters/sort by
New
H&R Block
Choices direct users to the best product
Mobile site
Configurator
 page
Finance
Configurator
New
H&R Block
Tax support form flow
Desktop site
Form
 page
Finance
FAQ/help
Form
Progress/steps
Tabs
New
H&M
Description placement increase exposure
Desktop site
Product details
 page
Fashion
Structure/hierarchy
Content
New
H&M
A sticky banner with anchor
Desktop site
Product details
 page
Fashion
Reviews/social proof
New
H&M
Sticky banner with product information
Desktop site
Product details
 page
Fashion
Modal/pop-up
New
H&M
The Size and Add to bag CTA are sticky
Mobile site
Product details
 page
Fashion
CTA
Size/dimensions
Sticky
New
Gumtree
Search engine displayed on the homepage
Desktop site
Homepage
 page
Automotive
Search
New
Guess
Newsletter pop-up
Desktop site
Homepage
 page
Luxury
Modal/pop-up
Newsletter
New
Guerlain
Ability to view image with 3D rotation
Desktop site
Product details
 page
Beauty
Imagery
New
Gucci
The filter bar stays sticky
Mobile site
Product listing
 page
Luxury
Filters/sort by
Sticky
New
Glossier
Free shipping threshold indicator
Mobile site
Cart/basket
 page
Beauty
Progress/steps
New
Glossier
Dropdown access to account sections
Mobile site
Account
 page
Beauty
Dropdown
Navigation/menu
New
Glossier
Eco-friendly packaging options
Desktop site
Checkout
 page
Beauty
Delivery
Personalisation
New
Glossier
GIF of model interacting on hover
Desktop site
Product listing
 page
Beauty
Imagery
Interactions
New
Glossier
Best selling product images in menus
Desktop site
Global element
 page
Beauty
Imagery
Navigation/menu
Featured products
New
Glossier
Badges on product listings
Mobile site
Product listing
 page
Beauty
Promotion
New
Glossier
Breadcrumb and slider on product list
Mobile site
Product details
 page
Beauty
Horizontal layout
Navigation/menu
New
Free people
Move items between saved list and cart
Desktop site
Cart/basket
 page
Fashion
Wishlist/save
New
Forever 21
Country selector in the header
Desktop site
Homepage
 page
Fashion
Country/language selection
Navigation/menu
New
Floyd
Graphic GIF highlighting a product feature
Mobile site
Product details
 page
Home/DIY
Imagery
New
Flamingo
Bundled product info in a modal on click
Desktop site
Product details
 page
Beauty
Content
Modal/pop-up
New
Fiat
Horizontal Scroll In-Page Navigation
Mobile site
Product details
 page
Automotive
Navigation/menu
New
Ferrari
Immersive media in the configurator
Desktop site
Configurator
 page
Automotive
Configurator
New
Fenty Beauty
Notification that informs the user of a promotion
Desktop site
Product details
 page
Beauty
Promotion
New
Faherty
Recommended add-on in the cart prreview
Mobile site
Cart/basket
 page
Fashion
Cross-sell/up-sell
Quick add
New
Faherty
Featured spots for popular products
Mobile site
Product listing
 page
Fashion
Featured products
New
Emoo
Direct links to categories
Desktop site
Homepage
 page
Services
Category shortcut
Navigation/menu
New
Ellevest
Drag and drop to prioritise investments
Desktop site
Configurator
 page
Finance
Configurator
New
Dune
Customer Instagram posts promote items
Desktop site
Homepage
 page
Fashion
Cross-sell/up-sell
Promotion
Reviews/social proof
New
Dropbox
Account security checkup flow
Desktop site
Settings
 page
Internet/tech
Progress/steps
FAQ/help
New
No results found, whoopsie daisy!
Clear all filters
Show more