# Glossier, Product

E-commerce brands · Product · Shopify · New York, USA
Live page: https://www.glossier.com/collections/skincare
On Designly: https://designly.sh/s/glossier/collections/skincare · JSON: https://designly.sh/s/glossier/collections/skincare?format=json
Site: [Glossier](https://designly.sh/s/glossier?format=md) (https://www.glossier.com)
Styles: minimal, type-led, light, editorial

## Why it works

Apercu type in black against a white background keeps the focus on the product photography. The grid uses off-white surfaces to separate items, while the red accent is reserved for specific promotional text to draw the eye to the Milky Jelly Cleanser offer.

## Sections, top to bottom

1. [Navigation: "Navigation"](https://designly.sh/s/glossier/collections/skincare#section-1) (y 0–72px of 4501) · image: https://designly.sh/media/captures/cap_9742a46fba044b4eb1a7cc4fa93a3e31/sections/0.webp · id sec_20267f9c4da742fbad97e063c9db89b3
2. [Hero: "Milky Jelly Cleanser"](https://designly.sh/s/glossier/collections/skincare#section-2) (y 72–3735px of 4501) · image: https://designly.sh/media/captures/cap_9742a46fba044b4eb1a7cc4fa93a3e31/sections/1.webp · id sec_ade41871c7a04eb2a51001aaa84451b8
3. [Footer: "Footer"](https://designly.sh/s/glossier/collections/skincare#section-3) (y 3735–4500px of 4501) · image: https://designly.sh/media/captures/cap_9742a46fba044b4eb1a7cc4fa93a3e31/sections/2.webp · id sec_b23cbcd8c85b4727897e924fc9c7e4a9

## Design tokens

- Colours: #FFFFFF (background), #000000 (text), #A85566 (accent), #E8E8E8 (surface), #666666 (muted)
- Fonts: Apercu (display)
- Section padding: 40px
- Export: https://designly.sh/s/glossier/collections/skincare?format=tokens.css · https://designly.sh/s/glossier/collections/skincare?format=tokens.json · https://designly.sh/s/glossier/collections/skincare?format=tokens.tailwind.css

## Images

- Desktop (1440×4501): https://designly.sh/media/captures/cap_9742a46fba044b4eb1a7cc4fa93a3e31/desktop.webp
- Mobile (390×5696): https://designly.sh/media/captures/cap_9742a46fba044b4eb1a7cc4fa93a3e31/mobile.webp
- Captured: 2026-10-26

## Other Pages of Glossier

- [Home](https://designly.sh/s/glossier?format=md) — /
- [About](https://designly.sh/s/glossier/pages/about?format=md) — /pages/about

## Related

- [Light Phone, Product](https://designly.sh/s/light-phone/shop/products/light-phone-iii?format=md) — E-commerce brands · Product · Custom code · Brooklyn, USA · styles: dark, minimal, type-led, luxe · image: https://designly.sh/media/captures/cap_f5225658126b442c8fbbd35c7990f6bc/desktop.webp
- [Teenage Engineering, Product](https://designly.sh/s/teenage-engineering/products/op-1?format=md) — E-commerce brands · Product · Custom code · Stockholm, Sweden · styles: minimal, type-led, geometric, tech · image: https://designly.sh/media/captures/cap_dcb2829513ef4af4a662da622e107e62/desktop.webp
- [Teenage Engineering, Product](https://designly.sh/s/teenage-engineering/products?format=md) — E-commerce brands · Product · Custom code · Stockholm, Sweden · styles: type-led, minimal, geometric, industrial · image: https://designly.sh/media/captures/cap_ef31d73530f74489b85ceec13d4b0dd9/desktop.webp
- [reMarkable, Product](https://designly.sh/s/remarkable/products/remarkable-paper/pro?format=md) — E-commerce brands · Product · Custom code · Oslo, Norway · styles: serif, editorial, minimal, photo-led · image: https://designly.sh/media/captures/cap_b4d8b127522048d297aa1800ac1c4e35/desktop.webp

Credit: every reference is a real business's site. If it shapes your work, link to the business and to its Designly page.