Hello Friend NG is a Hugo blog theme built by Djordje Atlialp that turns Markdown content into a responsive personal site with dark/light mode, PrismJS syntax highlighting, and audio embeds. It is inspired by the hello-friend and hermit themes and is released under the MIT License.
What is Hello Friend NG?
Hello Friend NG is an open-source theme for the Hugo static site generator, designed to cover the essentials of a blog or personal website. It takes content written in Markdown or other Hugo-supported formats and renders clean, fully responsive pages with a focus on reading experience. The theme runs entirely on Hugo's tooling, requires no Node.js build step, and is configured through standard TOML config files.
The theme supports taxonomies for categories, tags, and series, and includes a built-in shortcode called "image" for positioning images left, center, or right. It also offers optional sharing buttons, a global language switcher, and integrations with Commento and utterances for comments.
Key Features
- Dark/light mode — automatically matches system preferences or lets users toggle manually; no JavaScript framework required.
- Inter font — uses the Inter typeface by Rasmus Andersson for comfortable reading.
- PrismJS code highlighting — colorizes code blocks without a separate build step; just wrap code in triple backticks.
- Audio support — embed an MP3 player in a post by setting an "audio" field in front matter to a file path.
- Multilanguage menu — enableable/disableable global language switcher in the navigation bar, with per-language title, subtitle, and menu items.
- Social icons — a large set of SVG icons configurable with simple TOML entries; missing icons can be requested via issues or pull requests.
- Comment integrations — supports both Commento and utterances comment systems.
- Plausible analytics — optional support for Plausible analytics.
- Responsive design — fully responsive layout that works on mobile and desktop.
Who is it for?
Hello Friend NG is for bloggers and personal site owners who want a minimal, fast Hugo theme with essential features already built in. It suits developers who prefer Hugo's static site workflow and want to avoid Node.js dependencies, as well as multilingual authors who need a built-in language switcher. It's also a good fit for audio content creators who want to attach audio files directly to posts.
What can you do with Hello Friend NG?
- Bloggers — write Markdown posts in Hugo's content folder and get a clean, responsive blog with automatic dark mode, code highlighting, sharing buttons, and social links.
- Multilingual site owners — enable the global language menu to offer content in multiple languages, each with its own title, subtitle, and menu items.
- Audio producers — attach an MP3 file to any post via front matter, and the theme renders an audio player for that article.
- Theme developers — extend the theme by editing it directly; no Node.js tooling is needed, and Hugo's template system handles the setup.
How does Hello Friend NG work?
Install the theme by cloning the GitHub repository into your Hugo themes/hello-friend-ng directory or by adding it as a git submodule. Then copy the example configuration from the exampleSite into your Hugo config, adjust base URL, title, and language settings, and start writing content in the content folder. The theme reads TOML configuration and front matter to render pages, menus, and optional features like audio and sharing buttons.
FAQ
Is Hello Friend NG free?
Yes. The theme is released under the MIT License, so you can use, modify, and distribute it freely with attribution.
How do I add audio to a post?
In the post's front matter, add an "audio" field with the path to an MP3 file, for example audio: path/to/file.mp3. The theme will then display an audio player in the rendered post.
Which comment systems does it support?
Hello Friend NG supports Commento and utterances. Both can be enabled through configuration options in Hugo's config file.
What is the known issue with taxonomies?
The README documents a Hugo bug where empty taxonomy entries can cause the main page to render incorrectly. The workaround is to either comment out the taxonomies section or explicitly define [taxonomies] without entries if you need an empty taxonomy.
Does the theme support social icons?
Yes. Social icons are configured as a list under params.social with name and URL values. A list of available SVG icons is provided in the theme docs, and you can request additional icons via GitHub issues.
