← The UX Guide Vol. 1: Luxury Ecommerce
beauty · Shopify ·
La Prairie
La Prairie grew out of a clinic in Montreux and sells Swiss skincare at the top of the price range, with caviar extract and platinum among the ingredients its best known lines are built on.
The pages
desktop1440 x 900
mobile390 x 844
Palette
Surfaces, by share of painted area
90.8%
9.2%
90.8%
#ffffff
page
9.2%
#3e3e47
secondary surface
Ink, by share of text set in it
69.3%
11.9%
10.7%
69.3%
#3e3e47
body and headings
11.9%
#6f6f75
secondary
10.7%
#b5b5be
secondary
7.3%
#ffffff
reversed on dark
0.8%
#969696
secondary
Typography
sans-serif · everything
La Prairie
of all text on the page
100% sans-serif
The icon set
Ecommerce components, rebuilt to spec
Add to cart
- Type
- La Prairie 14px / 300 / 0.84px tracking / uppercase
- Color
- rgb(255, 255, 255) on #3d3d45, painted over #ffffff
- Shape
- 0px radius, 298 by 44px
- Label
- center, rebuild matched the photograph at 0.996
Product card
- Grid
- 3 across, 412px wide
- Image
- 1 : 1 crop, contain
Size and color
50 ml / 1.7 oz
100 ml / 3.4 oz.
Size selector
- Control
- radio list with text labels, 2 values
- Label
- Size
- Type
- La Prairie 12px / 300
- Cell
- 139 by 35px, 7px apart
- Chosen
- border 1px solid rgb(62, 62, 71) (unselected 1px solid rgb(229, 229, 231))
- On load
- one is already chosen