Hugo Now

Hugo Now is a Hugo blog theme created by Michael Blum as a port of Jekyll Now, the popular minimal blogging template. It runs on the Hugo static site generator and takes Markdown content plus a Hugo config.toml file as input, and produces a static website with blog posts, project pages, and a table of contents. The theme is licensed under the MIT License and is available on GitHub.

What makes Hugo Now stand out?

• Bootstrap 4 — Updated from Bootstrap 3 to 4, giving the theme a modern responsive grid and component set directly in the markup.
• Font Awesome icons — The theme includes the latest Font Awesome icon set for styling links and list elements.
• Progressive enhancement — The theme is designed so that disabling JavaScript retains the same user experience; pagination and navigation work without client-side scripting.
• SASS-powered styling — Style customisation is done by editing sass/style.scss; the build pipeline uses Dart SASS to compile style.css, with compressed output for production.
• Modern build pipeline — Because Hugo lacks Jekyll's asset pipeline, the theme relies on Gulp.js for build tasks such as compiling SASS.
• Emoji support — Emojis work in tags, titles, and post content using the Emoji Cheatsheet syntax.
• Server-side syntax highlighting — Code blocks are highlighted with Pygments (server-side rendering) instead of a JavaScript library, so highlights also appear in RSS feeds.
• Google Analytics and Umami Analytics — Analytics can be configured via config.toml, supporting both the legacy GoogleAnalytics key and UmamiAnalytics.
• Table of Contents — Headings are resolved into a styleable table of contents, toggled per post with a toc front matter flag.
• Taxonomies and pagination — The theme includes category and tag taxonomies, plus pagination with a configurable paginate count (default 10) and paginatePath.

Who should use Hugo Now?

• Bloggers migrating from Jekyll Now — They can reuse the same minimalist blog layout in Hugo while gaining Hugo's faster build times and simpler deployment.
• Hugo theme developers — They can study a clean port structure, including Hugo Modules integration and SASS compilation, as a reference for building their own themes.
• Tech-savvy writers — Writers who want a no-JavaScript-dependent blog that works well from RSS readers and keeps a consistent experience when JavaScript is disabled.
• Developers who want analytics and syntax highlighting — Users who need Google Analytics or Umami tracking and server-side Pygments highlighting without adding client-side dependencies.

What can you do with Hugo Now?

• Personal bloggers: publish Markdown posts with tags and categories, enable a table of contents per post, and get a static site that can be hosted anywhere.
• Project maintainers: showcase projects using the theme's project layout section (visible in the screenshots as a separate project page).
• Designers: customise the look by editing the SASS files and using Font Awesome icons for navigation and lists, then compile with Dart SASS.
• Hugo module users: add the theme as a Hugo Module for simple version updates with hugo mod get -u, or use a git submodule for a local fork.

How does Hugo Now work?

Installation is either via Hugo Modules (adding the import path) or as a git submodule. Configure the theme in config.toml by setting baseurl, title, analytics keys, and enabling PygmentsCodeFences for highlighting. For local development, run hugo server; for production, set the HUGO_ENV environment variable to use minified CSS from sass --style compressed.

FAQ

Is Hugo Now free?

Yes, Hugo Now is open-source and licensed under the MIT License, so it can be freely used and modified.

Does Hugo Now require JavaScript?

No. The theme follows progressive enhancement: disabling JavaScript should retain the same experience. Syntax highlighting is done server-side with Pygments, and analytics are loaded as usual, but the core layout and navigation do not rely on JavaScript.

How do I enable a table of contents in Hugo Now?

Set toc: true in a post's front matter. When true, the table of contents is shown; when false, it is hidden.

How do I update Hugo Now if I use Hugo Modules?

Run hugo mod get -u github.com/mikeblum/hugo-now to update to the latest version. If you installed it as a git submodule, pull the submodule repository instead.

What is the default Pygments style?

The theme defaults to the default Pygments style, and you can change it by editing sass/style.scss to point to a different Pygments style from the Pygments Styles reference.