Ethos
How this site is built.
Design
The colour system is Flexoki, a retro-inspired set of ink tones designed by Steph Ango. Light and dark themes are driven by CSS custom properties that swap with a single class toggle. The overall aesthetic is content-first — no gradients, no blurs, no glow effects. Every decoration serves a purpose.
Typography
Inter for all text — clean, modern, optimised for screens.
JetBrains Mono for code — a typeface made for developers.
Stack
Built with Next.js 16 and React 19, using the App Router and server components by default. Styled with Tailwind CSS v4. TypeScript throughout.
Hosted on Vercel. Source code on GitHub. Domain managed via Cloudflare.
Principles
- Server components by default — client JavaScript only where interaction demands it.
- CSS transitions over animation libraries — Framer Motion is restricted to two overlay components.
- No cookies. Minimal analytics via Vercel (privacy-focused, no personal data).
- Scroll animations use IntersectionObserver, not scroll-jacking libraries.
- Every page has semantic HTML and accessible focus states.
Tools
Designed and developed with the help of Claude Code. Edited in VS Code and Cursor. Version controlled with Git.