Çağdaş
An intimate, quiet editorial portfolio set against a deep black backdrop. Restrained serif display typography pairs with structured sans-serif case study metadata and monochrome photography.
Visit siteColour
Typefaces
- Display
- Lyon Text
- Body
- Söhne
- Mono
- —
- Source
- self_hosted
- Scale
- 10 · 14 · 16 · 18 · 19 · 24
Layout
- Grid
- 12 columns
- Container
- 1224px
- Spacing base
- 8px
- Radius
- 0px
Capture
- Category
- portfolio
- Sections
- 9
- Captured
- 2026-08-29
- Rhythm
- dark x9
Type rules
- display headlines set in Lyon Text serif at sentence case
- body copy and metadata labels set in clean Söhne grotesk
- metadata keys always uppercase with generous line spacing
Colour rules
- deep monochrome black background across all sections
- accent blue reserved exclusively for key brand highlights and subtle focus elements
- muted gray for secondary text and project details
Voice rules
- frame work around client context and specific technical execution
- use clear, unembellished metadata labels
Holds it together
- maintain an all-black background throughout every section
- split case study layouts into metadata left and screenshot grids right
- use subtle serif headlines paired with sans-serif body copy
Contrast
Type, measured
- Body
- 19px / 1.52
- Measure
- 47 characters
- Display
- 36px / 1.25
- Tracking
- 0.004em display
- Scale ratio
- 1.17
Voice
- Tone
- understated, precise, professional
- Sentences
- medium
- Person
- first
- Vocabulary
- technical
- Calls to action
- view, schedule, send
Built with
- Builder
- webflow
- Framework
- —
- Motion
- —
- WebGL
- —
- Nav
- top_bar, 8 items
- Length
- 10.9 screens
Sections in page order
3 marked strong · 9- 00
hero
An intimate and restrained dark portfolio hero featuring a low-key monochrome portrait paired with elegant editorial typography.
- Mood
- editorial + quiet
- Layout
- 9 col · asymmetric · airy
- 01
showcase
Quiet editorial portfolio item pairing dark structured project metadata with a dense grid of web page screenshots.
- Mood
- editorial + quiet
- Layout
- 12 col · split · balanced
- 02
showcase
A structured dark case study layout pairing understated editorial metadata on the left with modular web screen previews on the right.
- Mood
- editorial + quiet
- Layout
- 12 col · split · balanced
- 03
showcase
StrongA refined, quiet portfolio case study combining structured project metadata and serif editorial text with clean website UI captures.
- Mood
- quiet + editorial
- Layout
- 12 col · split · balanced
- 04
testimonial
StrongPitch-black, expansive testimonial section with dark floating cards and monochrome portraits set against deep negative space.
- Mood
- quiet + editorial
- Layout
- 13 col · split · airy
- 05
showcase
A stark, dark portfolio case study layout balancing editorial metadata on the left with a clean mosaic of website screenshots on the right.
- Mood
- editorial + clinical
- Layout
- 12 col · split · balanced
- 06
showcase
A quiet, dark portfolio case study pairing structured editorial project metadata on the left with modular website screenshots on the right.
- Mood
- editorial + quiet
- Layout
- 12 col · split · balanced
- 07
showcase
A quiet, dark portfolio case study presenting structured project metadata alongside a modular grid of web page screenshots.
- Mood
- quiet + editorial
- Layout
- 12 col · split · balanced
- 08
cta
StrongAn austere, pitch-black closing section with centered serif typography that invites quiet, unhurried contact.
- Mood
- quiet + editorial
- Layout
- 10 col · stacked · airy
