Personal Website

A personal portfolio and blog built with Astro, emphasizing readability, performance, and long-term maintainability.

AstroTypeScriptCSSMarkdownMDX

Architecture

The site is built with Astro and follows a strict separation of concerns:

  • Content lives in Markdown files
  • Layouts define page structure
  • Components provide reusable UI
  • CSS defines appearance through design tokens

Design Philosophy

The design draws inspiration from premium digital publications like Claude.ai:

  • Warm neutral color palette
  • Generous whitespace
  • Narrow reading width
  • Beautiful serif typography
  • Almost invisible UI

Key Features

  • Content Collections with Zod validation
  • Dark mode support via CSS custom properties
  • Responsive typography with fluid type scale
  • Lightweight by design
  • Markdown-first authoring with MDX for interactive elements