frankchimero.com website design: fonts, colors and UI patterns
4 featured captures, 5 prominent colors from frankchimero.com, with sourced design evidence from Fudge.
How is frankchimero.com designed? Show me the visual system I can use as a reference.
Design character
frankchimero.com is a quiet personal studio site: generous padding, bookish pacing, and almost no chrome. The system reads as essay-first design — light paper canvas, single-column reading measure, restrained sans at 14–18px, and large breathing room (often 64px padding). It feels human, slow, and intentionally under-designed compared to SaaS landings.
What should survive adaptation:
- Paper-light canvas and long vertical rhythm.
- Body-first type (14–16px/1.5) with occasional 18–24px titles.
- 64px padding as a signature spacious inset.
- Minimal navigation; content is the interface.
- No loud accents, cards, or growth-hack CTAs.
Foundations
Color
No structured colors. Visual system is near-monochrome:
| Role | Approx | Use |
|---|---|---|
| Canvas | #f7f4ef – #ffffff | Page |
| Ink | #1a1a1a | Body/titles |
| Muted | #666666 | Meta, secondary |
| Rule | #e5e5e5 | Rare dividers |
Typography
| Role | Size | Weight | LH |
|---|---|---|---|
| Body | 16px | 400 | 24px |
| Small / meta | 14px | 400 | 21–24px |
| Lead / title | 18–24px | 400 | ~27–29px |
No black display shouting — hierarchy is subtle size and space.
Spacing and layout
- Signature 64px padding on major containers.
- Secondary 12px vertical padding on tighter stacks; 18px margins between blocks.
- Single reading column; home is a vertical index of writing/work.
Visual language
- Essentially borderless and shadowless.
- Photography or project stills appear as simple blocks when present.
- Empty space is a material.
Components and states
- Sparse header identity.
- Linked list / index of essays and projects.
- Long-form text blocks.
- Quiet footer.
No complex interactive components in captures.
Responsive behavior
Desktop captures ~960–1712px. The 64px inset should reduce on narrow viewports but keep the airy single-column feel.
Practical guidance
Preserve paper calm, 64px breath, body-size honesty, minimal chrome. Avoid card grids, gradient heroes, sticky conversion bars, oversized marketing display.
Scope note
Five home captures at different scrolls/widths. Color roles and radii largely unsupported — character is screenshot-evident whitespace and type.
Captured pages
Colors
#f7f4ef#ffffff#1a1a1a#666666#e5e5e5