Building a Custom Hugo Theme with Tailwind CSS v4 and Submitting to Hugo Themes Gallery
This post documents the process of migrating a Hugo blog from the PaperMod theme to a custom theme built with Tailwind CSS v4, and submitting it to the official Hugo Themes gallery. Hugo + Tailwind CSS v4 Integration Hugo 0.157+ supports the css.TailwindCSS pipeline. Tailwind v4 uses @import "tailwindcss" syntax and no longer requires tailwind.config.js. /* assets/css/main.css */ @import "tailwindcss"; @theme { --color-primary: #2563eb; --font-sans: "Inter", sans-serif; } @variant dark (&:where(.dark, .dark *)); In templates, call css.TailwindCSS to process the stylesheet: ...
