Colophon
How this site is built
Built with Claude Code from the design system behind Dan Allen's site, then redesigned around my own brand.
Browser
The page arrives as finished HTML, then Vue takes over for interaction.
Interface
Accessible primitives and icons under every component on the page.
Styling
One token file drives both themes, light and dark.
Components
Every page and component is a typed single-file component.
Hosting
Renders each request on the server and sends the page to the browser.
shadcn-vue
Reka UI
Phosphor Icons
Tailwind CSS v4
Vue 3
TypeScript
Nuxt 4
Vite
VercelStack
- Nuxt 4, server-rendered on Vercel
- Vue 3 and TypeScript
- Tailwind v4, with every color, radius, shadow and spacing as a token
- shadcn-vue primitives on reka-ui, Phosphor icons
- Storybook 10, with the accessibility addon set to fail a story on any violation
- Prettier, husky and commitlint on every commit
The design system
I designed the logo in 2012. It is set in Wisdom Script. Headlines are Lust, and its italic picks out one or two words. Body text is Proxima Nova. The colors come from the logo: plum for every action, magenta for emphasis, and a blush tint behind the work. Large shapes are squircles, the smooth corners of an app icon. One token file drives light and dark, and no component knows which one it is in.
Process
It was built with Claude Code against a written rulebook: the architecture, the design system rules, the copy rules and the definition of done for a component. Every component has a story in Storybook and is checked in light and dark. Content lives in typed data, so a wording change is a data change. My resume is written once, and a check keeps the site and the PDF in step with it.