Skip to content
voxel.esq
blog

Building this site with Hugo, Tailwind & Nix

1 min read #Hugo#Nix#Tailwind

I wanted a personal site that I could rebuild identically in five years without archaeology. That ruled out a pile of loosely-pinned npm dependencies. Here’s the stack I landed on.

The stack

  • Hugo for content and templating — fast, single binary, no runtime.
  • Tailwind CSS v4 via the standalone CLI — so there’s no Node or PostCSS in the build at all.
  • Nix flake to pin everything — Hugo, Tailwind, and the exact package set.

Why the standalone Tailwind CLI

Hugo 0.161+ can call Tailwind through its asset pipeline, but that path wants the npm-published CLI. Instead I run the standalone tailwindcss binary that ships in nixpkgs and let Hugo consume the compiled stylesheet. The whole build is offline and reproducible:

nix build          # -> ./result with the finished site
nix run .#dev      # tailwind --watch + hugo server

One command to rule them all

Because it’s a flake, cloning the repo and running nix develop (or direnv allow) drops you into a shell with the exact Hugo and Tailwind versions. That’s the whole point: the lockfile is the environment.