Hello World

Welcome to hugo-tailwind-starter — a minimal, production-ready template for Hugo + Tailwind CSS v4.

Features

This starter includes everything you need to build a fast, modern static site:

• Hugo Pipes integration with Tailwind CSS v4
• Dark mode with system detection
• Client-side search
• SEO optimized with OGP and JSON-LD

Code Example

Here’s how the CSS pipeline works in baseof.html:

{{ $css := resources.Get "css/main.css" }}
{{ $css = $css | css.PostCSS | minify | fingerprint }}
<link rel="stylesheet" href="{{ $css.RelPermalink }}">

Getting Started

1. Clone the repository
2. Run npm install
3. Run hugo server

That’s it! No build scripts needed — Hugo handles everything.

Customization

Edit assets/css/main.css to customize your theme colors:

@theme {
  --color-primary: #3b82f6;
  --color-accent: #f59e0b;
}