Won Agency
Refined Swiss typography meets high-impact minimalism. Monochromatic contrast alternates between immersive dark hero wrappers and airy, gallery-grade white showcases.
Visit siteColour
Background#ffffff
Text#171717
Accent#000000
Surface#141415
Muted#898d99
Typefaces
- Display
- twkLausanne
- Body
- twkLausanne
- Mono
- —
- Source
- self_hosted
- Scale
- 10 · 14 · 16 · 18 · 20 · 22
Layout
- Grid
- 16 columns
- Container
- 1344px
- Spacing base
- 4px
- Radius
- 12px · 24px
Capture
- Category
- agency
- Sections
- 10
- Captured
- 2026-08-29
- Rhythm
- dark x2 → light x6 → dark → light
Type rules
- display type set tight with -0.025em tracking in sentence case
- single typeface family across all display, body, and UI scales
Colour rules
- strict monochrome palette anchored by crisp black and white transitions
- subtle low-contrast grey #898d99 reserved for auxiliary metadata and form labels
Voice rules
- concise copy under 30 characters per line
- action-oriented direct callouts
Holds it together
- alternate between deep dark viewports and airy white backgrounds to structure content pacing
- center key messaging statements in generous white space without surrounding clutter
- use rounded squircle cards for mockups and UI floating elements
Contrast
text on background17.9:1 AAA
muted text on background3.3:1 AA Large
text on surface1.0:1 fail
accent on background21.0:1 AAA
background on accent21.0:1 AAA
Type, measured
- Body
- 24px / 1.63
- Measure
- 29 characters
- Display
- 184px / 1.6
- Tracking
- -0.025em display
- Scale ratio
- 1.66
Voice
- Tone
- confident, direct
- Sentences
- short
- Person
- first
- Vocabulary
- plain
- Calls to action
- book, send, explore
Built with
- Builder
- —
- Framework
- next
- Motion
- —
- WebGL
- —
- Nav
- top_bar, 6 items
- Length
- 8.2 screens
Sections in page order
3 marked strong · 10- 00
hero
StrongA bold, sleek dark hero centering large typography encircled by floating, tilted portfolio thumbnails against a subtle textured backdrop.
- Mood
- bold + playful
- Layout
- 16 col · centered · balanced
- 01
cta
StrongA refined dark modal contact form featuring a personalized founder profile card and category pill selectors.
- Mood
- quiet + clinical
- Layout
- 13 col · centered · balanced
- 02
statement
A stark, airy typographic statement centered on clean white space, letting confident Swiss type carry the brand philosophy.
- Mood
- quiet + bold
- Layout
- 16 col · centered · airy
- 03
showcase
A sleek dual-card project showcase pairing tactile skeuomorphic 3D glass rendering with a dramatic handheld phone mockup.
- Mood
- quiet + dreamy
- Layout
- 2 col · grid · airy
- 04
showcase
StrongA cinematic, cool-toned case study showcase displaying a misty mountain brand installation within an expansive modern glass-walled atrium.
- Mood
- clinical + quiet
- Layout
- 16 col · centered · airy
- 05
showcase
A moody, low-lit portrait framed in a rounded card floats serenely amidst expansive white space.
- Mood
- quiet + dreamy
- Layout
- 16 col · centered · airy
- 06
stats
An airy, minimalist stat callout featuring an oversized gradient-tinted metric centered in generous white space.
- Mood
- quiet + bold
- Layout
- 9 col · centered · airy
- 07
showcase
A refined, clinical perspective mockup of a dark dashboard interface angled against an expansive, clean field of white.
- Mood
- clinical + quiet
- Layout
- 9 col · asymmetric · airy
- 08
cta
High-contrast dark mode call-to-action framed symmetrically by tilted smartphone mockups showing a polished client portal app.
- Mood
- bold + clinical
- Layout
- 16 col · centered · balanced
- 09
footer
An ultra-sparse white footer dominated by vast empty space and an isolated lowercase serif wordmark.
- Mood
- quiet
- Layout
- 13 col · asymmetric · airy
