outfit-hellohello-is
Swiss-style brutalist catalog aesthetic driven by massive red grotesque typography on a warm stone backdrop. Stark studio photography of monochrome merchandise punctuates a strict structural grid.
Visit siteColour
Background#ede4dd
Text#ff0001
Accent#ff0001
Surface#d2cac3
Muted#ff0001
Typefaces
- Display
- font
- Body
- font
- Mono
- —
- Source
- self_hosted
- Scale
- 11 · 12 · 14 · 16 · 18 · 24
Layout
- Grid
- 16 columns
- Container
- 1392px
- Spacing base
- 4px
- Radius
- 0px
Capture
- Category
- other
- Sections
- 6
- Captured
- 2026-08-30
- Rhythm
- light x6
Type rules
- display type is set edge-to-edge in heavy uppercase grotesque
- all copy and metadata rendered uniformly in intense signal red
- body text tracks tightly at negative 0.025em
Colour rules
- warm beige canvas dominates the background throughout
- all type and graphic dividers rendered in saturated scarlet red
- black and white restricted purely to product photography
Voice rules
- use graphic design inside jokes for product names
- keep body copy concise and deadpan
Holds it together
- render every piece of UI text, border, and metadata in signal red
- keep product photography strictly greyscale with stark studio lighting
- anchor the layout with massive poster-scale display headlines
Contrast
text on background3.2:1 AA Large
muted text on background3.2:1 AA Large
text on surface2.5:1 fail
accent on background3.2:1 AA Large
background on accent3.2:1 AA Large
Type, measured
- Body
- 14px / 1.14
- Measure
- 63 characters
- Display
- 184px / 1
- Tracking
- -0.05em display
- Scale ratio
- 1.90
Voice
- Tone
- witty, irreverent, confident
- Sentences
- short
- Person
- first
- Vocabulary
- niche
- Calls to action
- shop, visit
Built with
- Builder
- —
- Framework
- next
- Motion
- —
- WebGL
- —
- Nav
- sticky_top_bar, 3 items, sticky
- Length
- 4.5 screens
Sections in page order
6- 00
hero
Striking typographic poster layout commanding attention with massive edge-to-edge red lettering on a warm cream canvas.
- Mood
- bold + editorial
- Layout
- 1 col · stacked · balanced
- 01
showcase
Minimalist product grid with stark black merchandise photography framed by bright red Swiss-style catalog typography.
- Mood
- clinical + raw
- Layout
- 4 col · grid · balanced
- 02
showcase
Asymmetric product showcase pairing stark graphic merchandise photography with vibrant red metadata across a warm neutral canvas.
- Mood
- editorial + raw
- Layout
- 16 col · asymmetric · airy
- 03
showcase
Minimalist streetwear apparel showcase with studio product photography and sharp red typographic metadata over warm neutral tones.
- Mood
- quiet + bold
- Layout
- 3 col · grid · airy
- 04
showcase
Minimalist, airy merchandise showcase pairing stark graphic photography with sparse signal-red captions across an expansive warm cream canvas.
- Mood
- quiet + editorial
- Layout
- 16 col · asymmetric · airy
- 05
footer
High-impact typographic footer pairing vibrant red statement copy and an oversized copyright mark against a warm cream canvas.
- Mood
- bold + raw
- Layout
- 16 col · grid · airy
