Colophon

How this site is built.

Same posture as the case studies — instrumented, attributable, light. A nerd page on purpose: if you're reading this you're probably either evaluating my engineering taste or wondering how to ship one yourself. Both are fine.

Typography

Display and body in Geist Sans at weight 500. Mono labels, metadata, kbd hints and these swatches in Geist Mono. Loaded via next/font with display: swap and tuned fallback metrics, so the page never shifts on font swap.

Sans
Geist Sans — variable, weight 500 display
Mono
Geist Mono — uppercase micro labels, tabular-nums numerics

Palette

Encoded once as semantic tokens in tailwind.config.ts. Literal hex codes are an ESLint failure in every other route — this page is the only exception, because a colophon without swatches is just a page about a page.

  • surface#FAFAF7Warm off-white background
  • surface-elev#FFFFFFCards and elevated surfaces
  • ink#0A0A0ABody and display text
  • ink-muted#57534ESecondary text, metadata
  • hairline#E7E5E0Section dividers
  • accent#FF4D2EPersimmon — primary CTA fill, focus ring
  • accent-ink#B23718Accent text passing WCAG AA at 16px

Stack

Framework
Next.js 14 — App Router, React Server Components
Language
TypeScript (strict mode)
Styling
Tailwind CSS — semantic tokens only, no literal hex in components
Primitives
shadcn/ui (Button, Card, Separator, Badge) — MIT
Content
MDX via @next/mdx — case studies live in content/case-studies/*.mdx
Fonts
Geist Sans + Geist Mono via next/font, display: swap
Hosting
Vercel — region syd1 (Sydney)
Analytics
Vercel Web Analytics — no cookies, no banner needed
Repository
Public on GitHub from launch

Build pipeline

Every push runs through the same gates. The preview URL updates per commit; production is the same artefact promoted, not rebuilt.

  1. 01pnpm install
  2. 02pnpm typecheck
  3. 03pnpm lint
  4. 04pnpm test
  5. 05pnpm e2e
  6. 06pnpm build
  7. 07git push → Vercel preview deploy

Accessibility

This site targets Lighthouse ≥95 across every category and passes WCAG 2.2 AA. Every interactive element is keyboard-reachable with a visible focus ring; the page respects prefers-reduced-motion; the language is set to en-AU. If something doesn't work for you — email me. That's a bug, not a feature.

Contact: borbala.jarmy@gmail.com

Built with Claude Code on the Anthropic SDK — source.