Every state · 108 captures · 15 stores

Cart patterns

The cart, including the slide-in drawer that opens the instant an item is added, with upsells and free-shipping progress. Every example below is a real capture from a live storefront, not a mockup.

allbirds.comAdd to Cart

brooklinen.comAdd to Cart

carawayhome.comAdd to Cart

cotopaxi.comAdd to Cart

drinkolipop.comAdd to Cart

fahertybrand.com page before add to cart

fahertybrand.comAdd to Cart

fromourplace.com page before add to cart

fromourplace.comAdd to Cart

gymshark.comAdd to Cart

magicspoon.comAdd to Cart

meritbeauty.comAdd to Cart

paireyewear.comAdd to Cart

reebok.comAdd to Cart

rothys.comAdd to Cart

us.puma.comAdd to Cart

vineyardvines.com page before add to cart

vineyardvines.comAdd to Cart

About the cart pattern

What it is

The cart is the holding area between "I want this" and checkout, most often a slide-in drawer that opens the instant a product is added, though some stores route to a dedicated cart page instead. It shows what's been selected, lets a shopper adjust quantities or remove items, and is usually the last place upsells (related products, protection plans, gift wrapping) get a chance to appear before payment begins.

Why it matters for conversion

The cart is a leverage point disproportionate to how little content it holds: it's the last screen a store fully controls before handing the shopper to a checkout flow that's often templated and harder to merchandise. A cart that clearly shows progress toward free shipping, confirms the item just added, and makes it painless to keep shopping (rather than forcing a decision) keeps average order value climbing right up to the moment of payment.

What to look for

The strongest carts confirm the add immediately, a slide-in drawer rather than a silent update is far more reassuring, and keep a persistent, low-friction path both back to browsing and forward to checkout. A free-shipping progress bar ("$12 away from free shipping") is one of the highest-leverage single elements a cart can include, since it nudges order value up without feeling like a hard sell. Clear per-line pricing, easy quantity edits, and an always-visible subtotal round out a cart that doesn't create last-second doubt.

Common variations

DTC and fashion brands lean hardest on the free-shipping-threshold bar and cross-sell rails, since cart-stage upsells are cheap relative to the traffic already committed to buying. Marketplaces with third-party sellers often show a cart broken into per-seller groups with separate shipping estimates, since a single order can ship from several warehouses. Lower-margin categories like grocery frequently skip the drawer pattern entirely in favor of a persistent cart icon with a running total, since those carts are built up over many small adds rather than one big decision.