← OpenDesign CURATED · OPEN · FREE
Henry Codes
A bold, typographically-driven creative portfolio for a Denver-based web developer and designer.
Portfolio Bold Typography Editorial Studio Dark Mode
01
Identity DNA
Personal Portfolio Creative Web Developer Designer Denver Bold
A bold, experimental creative portfolio that feels like a mix of a high-fashion editorial and an underground zine.
02
Color
#2A2722Ink
#FAFAFABG
#666666Muted
rgba(42,39,34,0.1)Line
High-contrast monochrome with extreme typographic density and occasional brutalist layout shifts.
03
Typography
transitional-serif · geometric-sans
display 77px · 400body 16px · 40004
Spacing
4px
8px
16px
24px
32px
48px
64px
96px
Strict 4px base unit with generous whitespace to balance heavy typography.
05
Surfaces
sm · 0px
md · 12px
lg · 12px
pill · 999px
Simple 2px solid borders or no borders; relies on spacing and type weight for separation.
06
Layout
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
Full-bleed sections alternating between light and dark backgrounds.
07
Motion & Interaction
150ms micro
200ms small
400ms medium
cubic-bezier(0.645, 0.045, 0.355, 1) easing
Subtle hover transitions on links and interactive elements
Subtle color or width transitions. · Immediate response without bounce or scale effects.
08
Components
button Understated text-based links with hover transitions. card Minimal, borderless containers relying on typography for hierarchy. hero Massive, oversized typography filling the entire viewport width. 09
Voice & Don'ts
Tone Bold, unapologetic, and highly personal. Headlines Aggressive, oversized serif typography that commands attention. CTAs Subtle, text-based calls to action that let the content speak. Don't use soft, pastel colors — screenshot shows a high-contrast monochrome palette. Don't use playful, rounded UI elements — screenshot shows sharp, brutalist typography. Don't use small, dense grids — screenshot shows massive, full-bleed typographic layouts. Don't use subtle, decorative imagery — screenshot shows bold, pixelated or abstract art. Don't use traditional, safe layouts — screenshot shows experimental, overlapping text. Don't use a single background color — screenshot alternates between pure white and near-black sections. Avoid: Generic corporate language Avoid: Soft or playful design elements Avoid: Traditional grid-based layouts 10
Inside the pack — real screenshots
桌面首屏（hero） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 移动首屏 Captured from the live site · real computed styles
11
System prompt
This site is a bold, experimental creative portfolio for a web developer and designer. It features high-contrast monochrome backgrounds (#FAFAFA and #2A2722) and massive transitional-serif display typography paired with geometric-sans body text. The layout is brutalist and editorial, often breaking standard grid conventions. Critical donts: Don't use soft pastels, don't use playful rounded UI, and don't use traditional small grids.
More from the library en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
Why we curated this: This site is a prime example of bold, typographic-driven portfolio design that prioritizes personal expression over conventional UI patterns.
