Ground
Light #EDE9E1
Dark #141311
Page ground
Surface
Light #F6F3ED
Dark #1C1B18
Closing band, inputs, image grounds
Ink
Light #121110
Dark #F1EDE5
Text, primary button, ink bands, the timeline
Muted
Light #5C5852
Dark #A49E94
Secondary text
Line
Light #CFC9BE
Dark #2F2D29
Rules inside tables, the solid nav's bottom hairline
Accent
Light #7B1E2E
Dark #D97A88
Open strip number, set and step numbers, sale price, link underlines, cart badge, focus ring, text selection
Accent ink
Light #FFF4F2
Dark #141311
Text on accent
On image
Light #FFFFFF
Dark #FFFFFF
Text and buttons on photos and the video
Scrim
Light rgba(10,9,8,.5)
Dark rgba(10,9,8,.5)
Behind text on photos: one layer on the resting wide strips, the cart backdrop and the showroom panel
Scrim strong
Light rgba(10,9,8,.62)
Dark rgba(10,9,8,.62)
The hero over the video, the phone bands at rest and the next-piece label
Scrim caption
Light rgba(10,9,8,.75)
Dark rgba(10,9,8,.75)
The open strip's caption panel
On image ink
Light #121110
Dark #121110
The icon of the hero video control on its white hover fill
The left half of each chip is the live colour style, so it follows the theme button. The right half is the dark value as a fixed colour.
Statement
Panchang 600 · 64 / 45 / 32 px · line 0.9 · tracking −0.01em · uppercase
Heading 1
Panchang 600 · 83 / 62 / 40 px · line 0.92 · tracking −0.01em · uppercase
Heading 1 compact
Panchang 600 · 83 / 62 / 32 px · line 0.92 · tracking −0.01em · uppercase
Heading 2
Panchang 600 · 51 / 42 / 32 px · line 0.95 · tracking −0.01em · uppercase
Display 40
Panchang 600 · 38 / 32 / 24 px · line 1 · tracking −0.01em · uppercase
Strip name
Panchang 600 · 24 px · line 1 · tracking −0.01em · uppercase
Giant mark
Panchang 700 · 132 / 88 / 34 px · line 1 · tracking −0.01em · uppercase
Oak
Heading 3
Familjen Grotesk 500 · 24 / 24 / 22 px · line 1.2 · tracking 0
Title 40
Familjen Grotesk 500 · 38 / 31 / 24 px · line 1.1 · tracking −0.01em
List name
Familjen Grotesk 500 · 24 / 24 / 18 px · line 1.2 · tracking 0
Index name
Familjen Grotesk 500 · 24 / 24 / 18 px · line 1.2 · tracking 0
Heading 4
Familjen Grotesk 500 · 18 px · line 1.3 · tracking 0
Menu link
Familjen Grotesk 600 · 32 px · line 1 · tracking −0.01em · uppercase
Title caps
Familjen Grotesk 600 · 18 px · line 1.3 · tracking 0.06em · uppercase
Lead
Familjen Grotesk 400 · 18 px · line 1.5 · tracking 0
Body
Familjen Grotesk 400 · 16 px · line 1.5 · tracking 0
Body strong
Familjen Grotesk 500 · 16 px · line 1.5 · tracking 0
Prose
Familjen Grotesk 400 · 17 px · line 1.65 · tracking 0
Meta
Familjen Grotesk 400 · 14 px · line 1.4 · tracking 0
Rest name
Familjen Grotesk 500 · 14 / 14 / 16 px · line 1.2 · tracking 0.08em · uppercase
Catalogue number
Familjen Grotesk 500 · 14 px · line 1 · tracking 0.08em
Catalogue number strong
Familjen Grotesk 600 · 14 px · line 1 · tracking 0.08em
Price
Familjen Grotesk 500 · 20 px · line 1.2 · tracking 0
Price was
Familjen Grotesk 400 · 13 px · line 1.4 · tracking 0
Small
Familjen Grotesk 400 · 13 px · line 1.4 · tracking 0
Small strong
Familjen Grotesk 600 · 13 px · line 1.4 · tracking 0
Action
Familjen Grotesk 500 · 13 px · line 1 · tracking 0.08em · uppercase
Label
Familjen Grotesk 500 · 12 px · line 1.3 · tracking 0.08em · uppercase
Figure
Familjen Grotesk 600 · 48 / 48 / 40 px · line 1 · tracking −0.01em
Pin number
Familjen Grotesk 500 · 13 px · line 1 · tracking 0
Space 4
4 px
Space 8
8 px
Space 12
12 px
Space 16
16 px
Space 24
24 px
Space 32
32 px
Space 48
48 px
Space 64
64 px
Space 96
96 px
Space 128
128 px
Every padding and gap is one of these steps. Tablet takes the nearest step to the fluid value. Breakpoints: phone under 810, tablet 810 to 1199, desktop from 1200. Corners are square everywhere.
arrow
Phosphor ArrowRight
arrow-left
Phosphor ArrowLeft
chevron
Phosphor CaretDown
close
Phosphor X
menu
Phosphor List
pause
Phosphor Pause
play
Phosphor Play
truck
Phosphor Truck
return
Phosphor ArrowUUpLeft
shield
Phosphor ShieldCheck
phone
Phosphor Phone
Phosphor EnvelopeSimple
tick
Phosphor Check
check-circle
Phosphor CheckCircle
minus
Phosphor Minus
plus
Phosphor Plus
One set at one weight: Phosphor Regular. In Framer, insert the Phosphor icon with the name shown. Icons take their colour from the text style around them.
Light theme on
Hover and focus
Dark theme on
A 44 px text button in the label style, named by its visible word, with no aria-label; aria-pressed is true while the dark theme is on. The word names the theme it switches to; the 6 px square takes the text colour (white over the home hero). In the nav from 810 px, in the menu row below that.
Rest (number and rotated name over the scrim) and open (the caption over the scrim, the accent number). The wall gives the open strip six parts to the rest’s one; three in the team wall.
06
Ledge wall shelf
moss-daybed
Phone band at rest: 96 px, the picture clipped to the band; a tap opens it to 4:5 with the caption below.
A living room built around a linen sofa and a low steel table.
1 piece
The card a marker opens (hover, focus or tap). Markers are 36 px squares inside a 44 px button; under 810 px they hide and the list under the photo carries the cards.
10
Halo pendant
Opal glass, brushed brass
A flat disc pendant in opal glass with a brushed brass rim, 60 cm wide.
View piece
seating
2150
in
A
Set row, layout A (odd rows): packshot 5/12, in-situ 7/12, the detail 3/12 and the caption 4/12 under it. B (even rows) mirrors it with the caption under the packshot; every third row is C: the in-situ at 21:9 across the column and the packshot over its bottom-left corner. Phone: the in-situ, then the packshot (2/5) beside the number, name, price and finish, then the summary and the link; the detail crop is left out to hold the phone budget.
Email address
Enter an email address in the right format, like name@example.com
hello@vesterby
Full name
Clara H.
We reply within one working day.
Light theme
2016
Vesterby opened in 2016 as one bench in a rented Copenhagen workshop. Nine people now design and make every piece in the same building, in batches of 12 to 40.
No. 01
Moss daybed
€2,150
Primary
Secondary
Dark theme
2016
Vesterby opened in 2016 as one bench in a rented Copenhagen workshop. Nine people now design and make every piece in the same building, in batches of 12 to 40.
No. 01
Moss daybed
€2,150
Primary
Secondary
