Collection pages are where most ecommerce sites quietly fall apart. The hero gets all the design love, the product page gets the conversion attention, and the PLP gets a default grid template. These five brands treat the collection page like a design problem worth solving. Different industries, different solutions, all worth stealing from.
Skims: The Cleanest Grid You'll See
Skims' Tanks PLP opens with four small thumbnail tiles at the top filtering by sleeve type, then drops into a clean four-column grid of model photography against soft grey backgrounds. Each tile shows a different model in the same garment, no flat-lays, no detail shots, just bodies wearing product. Color swatches sit under each price. The filter bar across the top is text-only, no chunky buttons, no dropdown clutter. "Best Seller" and "Live Now" badges sit in small black tabs in the corner of select tiles.
What Skims does well:
- Four-column grid with consistent model-on-grey photography across every tile, so the eye scans down the page without snagging on a different image style
- Filters and badges are text-only and small, the photography never has to fight UI for attention
- Every product shows a different body, different skin tone, different pose, building a sense of range without needing a "diversity" callout
The page feels like a fashion lookbook with a buy button.
Why it works: Most apparel PLPs mix flat-lays, model shots, and detail crops in the same grid, which kills visual rhythm. Skims commits to one photo style and lets the bodies do the merchandising. The minimal UI keeps the focus where it should be, on the product, and the soft grey background makes every tile feel like part of one campaign.
Glossier: Product-First Pink
Glossier's PLP is almost the inverse of Skims. The grid is product-on-white, no models, no lifestyle context, just bottles and tubes shot from the front against clean backgrounds. Tile labels show product name, price, and a row of color swatches as small filled circles. A single hot-pink editorial tile sits inside the grid mid-page with a "Subscribe + save" promo, breaking the rhythm without breaking the layout. The bottom of the page expands into a dense A-Z list of every product the brand sells.
What Glossier does well:
- Product-on-white photography keeps every tile feeling like packaging shot in a studio, the brand's visual identity is the product, not the model
- Color swatches sit directly under the price as small dots, letting customers see the full shade range without clicking into the PDP
- The single pink promo tile dropped into the middle of the grid breaks predictability without disrupting the scan, and recalls the brand's signature color in one bold moment
The dense A-Z product list at the bottom is unusual and weirdly useful.
Why it works: Glossier's customer often knows the product name before they arrive. The clean white grid and color swatches let them scan fast, and the A-Z list is essentially a sitemap masquerading as design, helpful for returning customers who don't want to filter their way back to the Cloud Paint they bought two years ago. The minimal aesthetic also signals "we don't oversell," which lines up with the brand voice.
View full Glossier screenshots
Studs: Yellow Buttons and Sale Tags Done Right
Studs' Studs collection page leans into bold UI. Every product tile has a chunky yellow "ADD TO BAG" button right under the price, single-size variants in a dropdown. Sale prices show the original crossed out next to the new price in red. A bright yellow info card sits inside the grid with "DURABLE FOR DAILY WEAR — SAFE FOR SENSITIVE EARS" in red display type and a smiley face graphic. The header is a thin lime-green strip with sub-category links. The footer has a saturated yellow "FREE!" promo banner.
What Studs does well:
- Add-to-cart buttons sit directly inside every product tile, removing the click to PDP for customers who already know what they want
- Sale prices use red and crossed-out type as a deliberate UI pattern, the discount is the design, not buried in a small tag
- Bright yellow info cards interrupt the grid with brand promises (durability, sensitive ears) at the moment of consideration, not on a separate page
The whole thing has a high-energy retail feel.
Why it works: Studs sells low-consideration purchases (small earrings, multi-piece sets) where customers often buy more than one. The in-tile add-to-cart button removes friction for repeat browsers, and the yellow promo cards work as on-page reassurance for first-timers worried about ear sensitivity. The color palette matches the brand's playful identity without veering into chaotic.
Acne Studios: Editorial Grid With No Hand-Holding
Acne Studios' T-shirts PLP looks like a Vogue contact sheet. The four-column grid mixes full-length model shots, cropped portraits, and styled outfit photography. Models stand in different poses, wear different combinations, and some tiles show the product almost as an afterthought (a dog poses in front of a t-shirt, a model holds the shirt while wearing something else entirely). Prices and product names sit below each tile in small caps with multiple color dots. The header is minimal: "Acne Studios" centered, with a small filter button on the right.
What Acne Studios does well:
- Photography mixes editorial poses, fit shots, and styled outfits in the same grid, treating the PLP like a curated lookbook instead of a product catalog
- Minimal UI (just brand wordmark, filter, account icons) lets the photography fill the page with no visual competition
- Tiles aren't standardized, some show the garment clearly, others show context or styling, building brand mood over inventory clarity
The page assumes you already trust the brand.
Why it works: Most ecommerce best practice says "show the product clearly, every time." Acne breaks that rule on purpose. The varied photography signals confidence, the kind of brand where you buy the aesthetic, not the specific item. It works because Acne's customer is shopping mood as much as garment, and the page sells that mood harder than a clean product grid ever could.
View full Acne Studios screenshots
Pangaia: The Color Matrix
Pangaia's Hoodies PLP shows the same hoodie in roughly fifty different colorways, all worn by different models against a clean white background. The grid is dense, four columns wide and many rows deep, with each tile showing one model wearing one color of the same garment. Color swatches under the price match the hoodie shown. A small lifestyle photo card sits inside the grid near the top, breaking the matrix with a single editorial moment.
What Pangaia does well:
- Showing one product in every available color across the grid turns the PLP into a visual color picker, you choose the shade by scrolling, not by filtering
- Consistent model framing (same pose, same crop, same lighting) makes the grid read as a coherent palette instead of a chaotic catalog
- A single lifestyle card dropped into the matrix near the top adds context without breaking the scan-for-color logic
The repetition is the point.
Why it works: When the differentiator is color, the PLP should make color the experience. Pangaia could have used filters and color swatches like Skims or Glossier, but instead the whole grid becomes the swatch library. Scrolling is the same as cycling through options on a PDP, faster, more visual, more decisive. It also signals range (we make this in every color) in a way no badge or copy line could.
What They Get Right
Skims → One photography style, consistent grey backgrounds, minimal UI that lets the bodies merchandise
Glossier → Clean product-on-white grid with color swatches under price, plus a dense A-Z list for returning customers
Studs → In-tile add-to-cart, red sale prices as design language, yellow info cards that handle objections in-grid
Acne Studios → Editorial mix of fit, pose, and styling photography that sells mood instead of inventory clarity
Pangaia → A full-color matrix of one product treated as the swatch library, where scrolling replaces filtering
The best collection pages stop treating the grid as a default. Skims standardizes photography, Glossier strips the UI, Studs adds it back with intent, Acne breaks consistency on purpose, and Pangaia turns repetition into a feature. The pattern across all five is the same: pick what your customer is shopping for, color, fit, brand, speed, and design the grid around that one thing.
