THE FLAT FILE / site portfolio

34 prints · 4 drawers

A working portfolio, not a mood board

Thirty-four working websites. One system.

Every print in this file is a live, deployed site you can open, tab through, and view source on: hand-set vanilla HTML, CSS, and JavaScript on one shared skeleton, no framework, no build step, no two alike. The shelf is deliberately colorless; each print carries its own site’s accent.

  • 34 sites, every one live right now
  • 0 frameworks, build steps, or npm packages
  • ≤10 KB gzipped script per site, measured
  • 34 type pairings, no two the same (printed on every card)
Drawer 01

The Panel

Thirteen flagships, one per niche, Praxis first. No two share a typeface, an accent, a hero, a nav, or a signature mechanic; each was built alone, not as a batch.

Drawer 02

Left Field

Thirteen experiments where the mechanic is the spine: a site that is a receipt, a ledger, a day, a departures board. Every one still rests as a complete, keyboard-operable page with scripts off.

Drawer 03

The Local Line

Five deliberately simple one-pagers for a local business: one conversion object each, the phone number always in reach.

Drawer 04

The Artists

Three musician sites with privacy-first players: nothing loads from SoundCloud or Spotify until a visitor presses play, and one slot accepts either platform's link or pasted embed code.

The invisible bones

What every print inherits, whatever it looks like

  • Vanilla, on purpose No framework, no build step, no package manager. Two stylesheets and a small hand-written script layer per site (one file on most, three on Praxis), all of it readable with View Source.
  • A token skin Grounds, accent, type, and motion live in one tokens file per site. A change of look is a token swap, not a rebuild.
  • Complete without JavaScript Every page rests finished with scripts off: menus, menus’ fallbacks, forms with real destinations, players as real links. Reduced motion gets replacements, not leftovers.
  • Honest by rule No invented testimonials, logos, or metrics anywhere in the file. Sample content is chipped SAMPLE; unset values say [set your X] out loud.
  • Locked down Every site ships a hashed Content-Security-Policy, security headers, and a designed 404. The only third-party code anywhere in the file is SoundCloud's and Spotify's players on the three artist sites, and none of it loads until a visitor presses play.
  • Weighed and stamped Every script in the file was measured gzipped, not estimated: no site exceeds 10 KB of script in total, the five one-pagers run 2.5 to 3.3 KB, and the heaviest is Praxis at 9.9 KB across its three files. The screenshots were captured from the live fleet on 17 Aug 2026.