Stage 1 · Setup check
Setup
This page shows the design tokens exported from Figma, the ten text styles and the font status. Press G to show or hide the layout grid.
Fonts
- Inter
- Checking…
- Forma DJR Cyrillic Display Medium
- Checking…
Text styles
Display · Forma DJR Cyrillic Display Medium · 160 px desktop, 64 px mobile · line height 90% · letter spacing 0
Saturday
Statement · Forma DJR Cyrillic Display Medium · 58 px desktop, 32 px mobile · line height 90% · letter spacing 0
Brand identity and packaging, designed in London.
Heading · Forma DJR Cyrillic Display Medium · 48 px desktop, 28 px mobile · line height 90% · letter spacing 0
Selected work
Title · Forma DJR Cyrillic Display Medium · 23 px desktop, 20 px mobile · line height 87% · letter spacing 0
Brand identity
Body · Inter Medium · 16 px desktop, 16 px mobile · line height 120% · letter spacing -4%
Stacy Saturday Studio is a London-based brand design and art direction practice.
Small · Inter Medium · 14 px desktop, 14 px mobile · line height 120% · letter spacing -4%
Brand identity, packaging and art direction.
Link · Inter Regular · 13 px desktop, 13 px mobile · line height 100% · letter spacing -3% · uppercase
All services
Label · Forma DJR Cyrillic Display Medium · 12 px desktop, 12 px mobile · line height 120% · letter spacing 1 px · uppercase
What I do
Tag · Inter Medium · 12 px desktop, 12 px mobile · line height 120% · letter spacing -4%
Packaging
Micro · Inter Regular · 10 px desktop, 10 px mobile · line height 100% · letter spacing 0
London 14:32
Colour
bg/page
gray/950
bg/surface
gray/900
bg/raised
gray/800
bg/control
gray/700
bg/inverse
gray/50
text/primary
gray/50
text/secondary
gray/450
text/tertiary
gray/400
text/muted
gray/700
text/inverse
gray/950
text/error
red/500
border/default
gray/700
border/strong
gray/500
border/error
red/500
action/bg
gray/600
action/text
gray/50
logo
gray/50
Spacing
- 4
- 8
- 10
- 20
- 30
- 40
- 60
- 100
- 150
- 250
Radius
none
0
sm
2
md
10
lg
20
full
999
Layout
- page-width
- 1440 desktop · 390 mobile
- margin
- 20 desktop · 20 mobile
- gutter
- 10 desktop · 10 mobile
- columns
- 10 desktop · 4 mobile
- section-gap
- 100 desktop · 60 mobile