Why my homepage is a branch in a bowl
I rebuilt this site three times this month. Here's the version I kept, why the hero is a git branch, and how it stays fast.
I rebuilt this site three times in a month. The first version was a manga. The second was a fake Linux desktop with a neon terminal in the middle. Both looked fine, and both looked like something a model would make if you asked for “a creative developer portfolio”. So I threw them out.
This version starts from one idea: a tokonoma, the alcove in a Japanese room where you put one hanging scroll and one flower arrangement, and leave the rest of the wall empty on purpose.
The branch is real
The thing in the bowl is my career drawn as a single git branch. The thick stem is the main line, the small rings on it are commits, and the three lime buds are what’s alive right now: InnoLearn, Armani English, and these notes. Click a bud and it takes you there.
$ git log --oneline --graph * innolearn (2025, remote, Melbourne) * armani (2022, Tehran) * notes (you are here)
It’s a hand-authored SVG path with pathLength="1", so the grow-in is one stroke-dashoffset animation from 1 to 0. No library, no canvas.
Why it’s fast
Every page is static HTML from Astro. The home page ships the terminal, the photo toggle and the day/night switch, and that’s it. The photo is the largest thing on the first screen, so it’s preloaded as a 420px WebP.
/* the whole theme is two sets of custom properties */
:root { --plaster: oklch(0.936 0.013 128); --ink: oklch(0.25 0.014 112); }
:root[data-theme='dark'] { --plaster: oklch(0.205 0.009 128); --ink: oklch(0.93 0.012 115); }
What’s next
The Lab page is reserved for a lofi radio and a pomodoro timer. They’ll keep playing while you move between pages.
