Sarah Zaheer
A quiet, architectural portfolio balancing vast negative space with delicate grotesque typography. Monolithic dark fields alternate with stark white canvases, framing thoughtful design case studies with gallery-like restraint.
Visit site ↗Colour
Background#ffffff
Text#1f1f1f
Accent#1f504d
Surface#1e1e1e
Muted#4c4c4c
Typefaces
- Display
- Archivo Regular
- Body
- Archivo Regular
- Mono
- —
- Source
- self_hosted
- Scale
- 14 · 16 · 18 · 20 · 24 · 71
Layout
- Grid
- 12 columns
- Container
- 1440px
- Spacing base
- 5px
- Radius
- 0px
Capture
- Category
- portfolio
- Sections
- 19
- Captured
- 2026-08-27
- Rhythm
- light → dark x2 → light x7 → dark x9
Type rules
- display typography set in sentence case with italicized emphasis on expressive words
- body text set at 24px with tight tracking and a narrow 42-character measure
Colour rules
- monochromatic black and white fields dominate the hierarchy
- accent colors appear exclusively as project-specific background cards
Voice rules
- bracketed micro-statements frame philosophy
- metadata kept concise and technical
Holds it together
- bracketed micro-statements anchor the layout margins
- mix roman and italic styles within the same headline phrase for emphasis
- use circular badge elements for primary interactive calls to action
Contrast
text on background16.5:1 AAA
muted text on background8.6:1 AAA
text on surface1.0:1 fail
accent on background9.1:1 AAA
background on accent9.1:1 AAA
Type, measured
- Body
- 24px / 1.1
- Measure
- 42 characters
- Display
- 230px / 0.8
- Tracking
- -0.07em display
- Scale ratio
- 1.76
Voice
- Tone
- reflective, understated, precise
- Sentences
- short
- Person
- first
- Vocabulary
- thoughtful
- Calls to action
- talk, scroll
Built with
- Builder
- framer
- Framework
- —
- Motion
- lenis
- WebGL
- —
- Nav
- —
- Length
- 21.3 screens
Colour, by area
accent on container#ffffff 0%#fcfcfc 0%#1e1e1e 0%#1f1f1f 0%#000000 0%#1f504d 0%
Sections in page order
3 strongest marked · 19- 00
nav
An ultra-minimal, airy navigation bar floating quietly across an expanse of clean white space.
- Mood
- quiet
- Layout
- 15 col · full bleed · airy
- 01
other
Minimal, quiet introductory space utilizing a dark palette and sparse typographical elements.
- Mood
- quiet + clinical
- Layout
- 14 col · grid · airy
- 02
statement
StrongestExpansive dark canvas with radical negative space, punctuated by bracketed micro-statements and an off-center circular call-to-action.
- Mood
- quiet + clinical
- Layout
- 12 col · asymmetric · airy
- 03
other
StrongestA stark, minimalist utility header with uppercase technical metadata framing an expansive, empty white canvas.
- Mood
- clinical + quiet
- Layout
- 12 col · stacked · airy
- 04
statement
An airy, minimalist statement section anchored by large grotesque typography and generous white space.
- Mood
- quiet + editorial
- Layout
- 12 col · stacked · airy
- 05
statement
Clean Swiss-inspired editorial bio pairing restrained typography with a fragmented collage portrait.
- Mood
- editorial + quiet
- Layout
- 12 col · split · airy
- 06
showcase
Vast negative space creates a hushed gallery atmosphere punctuated by an off-center cropped portrait and tiny typographic captions.
- Mood
- quiet + editorial
- Layout
- 12 col · asymmetric · airy
- 07
other
StrongestAn ultra-sparse, quiet composition dominated by vast negative white space anchored by a single geometric dark block.
- Mood
- quiet + raw
- Layout
- 16 col · centered · airy
- 08
other
An entirely blank, empty expanse with no discernible visual content or structure.
- Mood
- quiet
- Layout
- 16 col · stacked · airy
- 09
statement
Vast expanse of white space anchoring a minimal case study section header with clean, precise typography.
- Mood
- quiet + clinical
- Layout
- 14 col · asymmetric · airy
- 10
showcase
Minimalist dark portfolio card defined by gossamer-thin oversized typography, generous negative space, and understated mobile photography.
- Mood
- editorial + quiet
- Layout
- 14 col · asymmetric · airy
- 11
showcase
An expansive forest green portfolio showcase featuring giant light-weight typography, metadata pills, and an angled mobile mockup in natural lighting.
- Mood
- editorial + quiet
- Layout
- 12 col · asymmetric · airy
- 12
feature
A minimal, deep-toned section introducing a structured multi-step creative design process.
- Mood
- quiet + clinical
- Layout
- 15 col · stacked · airy
- 13
other
A silent, monolithic dark band functioning as an understated structural break between sections.
- Mood
- quiet
- Layout
- 16 col · full bleed · airy
- 14
showcase
An austere, dark minimal layout featuring staggered numbered rectangular color chips descending through vast negative space.
- Mood
- quiet + clinical
- Layout
- 15 col · asymmetric · airy
- 15
showcase
A stark, empty dark monochrome canvas with an austere and quiet presence.
- Mood
- quiet + clinical
- Layout
- 1 col · stacked · airy
- 16
other
A stark, nearly blank dark transition section creating a quiet pause in the layout.
- Mood
- quiet
- Layout
- 11 col · full bleed · airy
- 17
other
An austere, uniform dark grey field serving as an unadorned visual pause.
- Mood
- quiet
- Layout
- 15 col · full bleed · airy
- 18
other
A monolithic, quiet dark charcoal void serving as a minimal transitional space.
- Mood
- quiet
- Layout
- 12 col · full bleed · airy
