This site is one HTML file. No framework, no build step, no bundler. Everything you see, including the starfield and the tabs, is plain CSS and a few hundred lines of JavaScript inside index.html.
The starfield
The background started as a port of uilab's Grok Background: three layers of tiny dots drifting upward at different speeds, with a slight parallax that follows the mouse. The original is a React component built on the Motion library, so I rewrote it without either.
It later became a canvas. Each star is now a particle, and on the Projects tab the particles fly to the cells of a pixelated image, the way uilab's Pixelated Canvas samples a picture into a grid of blocks. Switch tabs and they scatter back into stars. The gather takes 1.4 seconds and snaps instantly if your system asks for reduced motion.
The tabs
The pill that slides between Me, Projects and Blog is a port of uilab's Animated Tabs. It's a single absolutely positioned element that measures the active button and moves there with a cubic-bezier that overshoots a little, which reads as a spring. The tabs update the URL hash, so #projects and #blog are shareable, and they work with the arrow keys.
Hosting
The folder deploys to Vercel with one command, and the domain comes from Namecheap pointed at Vercel with two A records and a CNAME. The whole thing lives in a private GitHub repo.
What I'd change
- Real screenshots for the project cards instead of the placeholder thumbnails.
- A light theme. The starfield only works on black, so for now the site is dark only.