Alex.


This is a colophon page1.

$ cat ~/philosophy.md _

Philosophy

This site is built with a few core principles in mind: performance, accessibility, and longevity. I wanted something that loads fast, works for everyone, and won't break long term.

It's static-first. Every page is pre-rendered at build time. No servers to scale, no databases to maintain, no runtime to worry about. Just HTML, CSS, and a sprinkle of JavaScript where it genuinely helps.

The retro aesthetic isn't just nostalgia, it's a deliberate choice. Pixel fonts, simple layouts, and minimal animations. They remind me of the early web, when personal sites were weird and wonderful and unapologetically personal.

$ npm list --depth=0 _

Tech Stack

Built with modern tools that prioritize developer experience without sacrificing performance:

Static site generator Astro
Type safety TypeScript
Content authoring MDX

Plus a constellation of integrations: sitemap generation, RSS feeds, MDX support, PWA capabilities, static search via Pagefind and lots more!

$ dig alexmbugua.me _

Hosting

Deployed on Netlify with automatic deploys from GitHub. The site is also mirrored on GitHub Pages for redundancy. Domain registered through Namecheap.

Almost everything is statically generated, just files on a CDN. The guestbook is the one exception: it uses server-side rendering via a Netlify Function so entries appear instantly without waiting for a redeploy. Guestbook data lives in a self-hosted Astro DB + Turso database.

$ fc-list | grep -i design _

Typography & Design

Fonts

  • 0xProto Nerd Font Mono via Nerd Fonts — Primary monospace font. Designed for source code legibility. Patched by Nerd Fonts for extended Unicode glyph coverage.
  • Uni 05_53 — Retro pixel font by Craig Kroeger. For that pixelated feel.

WOFF2 files are generated from the Nerd Fonts TTF releases using fontTools. See the note on patching & converting web fonts for details.

Icons

Custom icon font built with IcoMoon, combining icons from:

ASCII Art

All ASCII art on this site is pre-generated at build time using figlet.js by patorjk .

Colors & Patterns

The color palette uses OKLCH for perceptually uniform colors that work beautifully in both light and dark modes. The subtle background texture comes from Hero Patterns (Topography pattern). See the full design token palette for colors, typography, and component recipes.

$ axe --include="body" _

Accessibility

This site is designed with accessibility in mind. That means:

  • Semantic HTML with proper heading hierarchy
  • Skip links for keyboard navigation
  • Visible focus indicators
  • Color contrast targeting WCAG AA guidelines
  • Respecting prefers-reduced-motion
  • Alt text for images

I haven't commissioned a formal audit, so I won't claim full compliance - but accessibility is a priority, not an afterthought.

$ lighthouse --only-categories=performance _

Performance

Fast by default. The approach is simple:

  • Static generation - HTML ready at the edge
  • Minimal JavaScript - only where it adds real value
  • Optimized assets - compressed images, minified CSS
  • Service Worker - offline support and intelligent caching
  • No tracking scripts - nothing to slow you down

Lighthouse goals: 90+ Performance, 100 Accessibility, 100 Best Practices, 100 SEO. Actual results may vary by page and connection.

$ git log --oneline _

Open Source

This site is open source under the MIT License. Feel free to explore, fork, or contribute.

Tools & Inspirations

The 8-bit avatar generator is based on 8biticon by Matvii Diadkov ( matveyco).

$ echo $AUTHOR _

A Note from Alex Mbugua

I've always loved the intersection of technology and creativity. This site aims to reflect that. It's a place for technical writing, personal projects, and the occasional tangent into chip music and retro aesthetics.

The 8-bit vibe isn't accidental. I grew up with chunky pixels around the C64 and Atari gaming eras, and those influences still shape how I think about design.

Thanks for visiting. If you'd like to connect, you can find me on GitHub , say hello , or drop a note in the guestbook .


$ exit _

Built by Alex Mbugua Ngugi · Leader, Mentor, Engineer, Chip Musician