Hugo-dusk

Hugo-dusk is a simple, minimalistic dark theme for the Hugo static site generator, built to turn Markdown content into a responsive blog with configurable colors, syntax highlighting, and social metadata.

What is Hugo-dusk?

Hugo-dusk is a dark-colored theme for Hugo, an open-source static site generator. It takes Hugo content written in Markdown plus a config.toml file as input and outputs a static website with features like responsive design, Chroma-based syntax highlighting, and OpenGraph/Twitter card metadata. The theme is maintained on GitHub by the developer gyorb and is available as a public repository.

Key Features

• Responsive minimalistic design — The layout adapts to small and large screens without pulling in a CSS framework, keeping the generated pages fast.
• Configurable theme colors — The default dark palette is defined in static/css/default-dark.css; you can swap the file or change the theme_colors parameter in config.toml.
• Built-in syntax highlighting — Uses Hugo's native Chroma highlighter; the example config sets style = "gruvbox" and lists alternative dark styles like monokai, api, fruity, native, and rrt.
• OpenGraph and Twitter cards — Supports OGP and Twitter Card metadata, and can auto-generate OpenGraph images from the site baseURL and page title when generate_opengraph_image is enabled (requires opengraph-post-blank.png and opengraph-logo.png in assets).
• Mastodon and Fediverse support — Adds Mastodon profile verification via the [params.mastodon] block and a Fediverse creator meta tag through [params.meta.fediverse].
• Two comment systems — Disqus comments are enabled by setting disqusShortname; Utterances (GitHub-issue-based comments) activates when utterancesRepo is set, with configurable utterancesTheme and utterancesIssueTerm.
• Google Analytics and custom 404 — Standard googleAnalytics config is honored, and the theme includes a custom 404 page.
• Configurable pagination and lazy menu — The paginate setting controls posts per page, and the navigation menu loads lazily to reduce initial page weight.

Who is it for?

• Hugo users building a personal blog — Install the theme by cloning the repository into your themes directory, set theme = "hugo-dusk" in config.toml, and start writing Markdown posts.
• Developers who want code-friendly styling — The Chroma syntax highlighter supports many dark styles, and the [markup.highlight] block makes it simple to switch.
• Mastodon or Fediverse users — Verify your Mastodon profile and add a creator tag to your blog headers so posts are attributed correctly on the Fediverse.
• Site owners who want social sharing polish — Automatically generate OpenGraph images for each post so link previews show a custom card with the page title and your site URL.

What can you do with Hugo-dusk?

• Start a blog in minutes — Clone the theme, copy the example configuration, and you have a dark blog with pagination, menus, and taxonomy pages for categories, tags, archive, blog, and series.
• Match your brand colors — Replace the color CSS file or set theme_colors to a different file to change the entire site palette.
• Add comments without third-party services — Use Utterances to store comments as GitHub issues, or Disqus for a hosted comment system.
• Verify your identity on Mastodon — Add your username and server under [params.mastodon] to display profile verification on your blog.

How does Hugo-dusk work?

The theme relies entirely on Hugo's static generation. You configure it through config.toml and optional [params] sections; content lives in Markdown files under content/. When you run Hugo, it renders pages using the theme's templates, applies the selected color stylesheet, and writes a static site you can deploy anywhere.

FAQ

Is Hugo-dusk free?

Yes, the theme is published as a public GitHub repository and does not require payment or registration to download and use.

What do I need to run Hugo-dusk?

You need Hugo itself (the static site generator) and a way to clone the repository, such as Git. The theme works with a standard Hugo project structure and uses Hugo's built-in Chroma for syntax highlighting.

How do I enable Utterances comments?

Set utterancesRepo to your GitHub repository name, for example yourname/yourrepo. Optionally set utterancesTheme (default is github-dark) and utterancesIssueTerm (default is pathname). Utterances then loads automatically.

How do I generate OpenGraph images?

Set generate_opengraph_image = true and place two images in your assets directory: opengraph-post-blank.png at 1200x630 pixels and opengraph-logo.png at 400x400 pixels. The theme overlays the site baseURL and the page title onto the blank image for each post.