Colophon

Typography

Body and UI in Geist by Vercel — a clean neo-grotesque with optical balance that's hard to fault. Headlines in Source Serif 4 by Frank Grießhammer for Adobe, a contemporary text serif that reads professional at display sizes. Both are self-hosted variable fonts via Fontsource.

Monospace in Geist Mono, for code.

Colour

Neutrals carry the contrast budget; one accent — basil green, the brand colour — appears subtly in the avatar ring, tag pills, and focus moments. Background is warm paper (#fbfaf7), not pure white. Dark mode followsprefers-color-scheme and an explicit toggle.

• Foreground
• Background
• Surface muted
• Basil accent
• Pine accent
• Young basil

Stack

• Astro (static output, content collections)
• Tailwind CSS v4 with CSS-variable semantic tokens, via @tailwindcss/vite
• MDX via @astrojs/mdx for blog posts
• Shiki dual-theme syntax highlighting (github-light / github-dark)
• TypeScript across the board
• Deployed as plain static HTML — no runtime, no API

Accessibility

Every interactive element has a visible :focus-visible ring. A skip-to-content link is the first tab stop on every route. Motion respectsprefers-reduced-motion — lifts, reveals, and the parallax avatar all turn off when the OS asks. Body text targets WCAG AA contrast.

Performance

The site is a fully static build. Every page is prerendered at build time. Almost no client JavaScript ships — only the pre-paint theme bootstrap, the theme toggle, and the home-page avatar's subtle parallax. Scroll reveals use native CSS scroll-driven animation, no IntersectionObserver.