Colour
Six tokens. Cobalt marks what is current.
Background/Page
#FFFFFF
Surface/Soft
#EFEFEF
Text/Primary
#111111
Text/Secondary
#6F6F6F
Accent/Cobalt
#2F4BFF
Text/Inverse
#FFFFFF
Typography
Bricolage Grotesque in six styles.
Salt Flat
Drum · 96, 72, 44 px · the turning titles on Home
Blue Stretch
Title · 56, 44, 34 px · one h1 per page
I photograph and direct campaigns and short films, mostly outdoors.
Lead · 24, 22, 19 px · statements and project text
Orgel
Wordmark · 20 px · the name in the header
Halden Goods asked for a catalogue of everyday objects.
Body · 15 px · navigation, lists and footer
Commercial, 2026
Body Muted · 15 px · labels and meta
Sound
Bars move while the music plays.
Sound on
Playing: Salt Flat
Every project is one step on the drum and one note of a lo-fi piano tune. Four projects make a chord, sixteen steps make a cycle, and every cycle changes the chords. Tempo, chords, melody and samples sit at the top of the Orgel code file.
Links
Three link styles.
Layout
12 columns, 16 px gutter.
Margins are 24 px on desktop, 20 px on tablet and 16 px on phones. Breakpoints at 1200, 810 and 390. The header is fixed and shares the column lines with the page.
Content
One collection: Projects.
Title, Slug, Kind, Client, Year, Role, Place, Summary, Cover, Video, Gallery and Body. The order of the collection is the order of the drum, the work list and Next project. Give every project its own cover.