HugoBlog

hugo-bearblog — Hugo Blog Template

By janraasch

A Hugo blog theme based on the Bear Blog style, offering light and dark color schemes, with content structure configured through exampleSite and hugo.toml.

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

3 previews
Desktop homepage1 / 3
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 3

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-09-30View source

What stands out

A quick read of the recorded project description.

01

A Hugo-based blog theme designed with reference to Bear Blog's minimalist style

02

Light color scheme by default, automatically switching to dark when browser dark mode is enabled

03

Provides an exampleSite demo site and hugo.toml configuration as a starting point

04

Homepage content is controlled by content/_index.md; pages and posts are created via the hugo new command

05

Custom styles can be added or custom.css imported via layouts/partials/custom_head.html

06

Released under the MIT license, allowing use, modification, commercial use, and distribution

Template Details

hugo-bearblog is a Hugo theme designed with reference to Bear Blog's minimalist blog format. The repository provides an exampleSite demo site and a hugo.toml configuration file, which can serve as a starting point for building a blog: copy the contents of the exampleSite directory into your own source directory to understand how the theme works, then gradually replace it with your own content.

The theme uses a light color scheme by default and automatically switches to a dark color scheme when the browser is in dark mode; the relevant implementation is located in layouts/partials/style.html. In terms of content organization, the homepage content is controlled by content/_index.md, pages and blog posts are created via the hugo new command, and blog posts are placed in the blog directory.

For branding and style customization, you can add custom_head.html in the layouts/partials directory and write a <style> tag in it, or import a separate custom.css file via <link>. The repository also lists community-maintained derivatives, such as hugo-bearblog-neo with Chinese documentation and hugo-bearcub with multilingual support; these are independent branches and are not maintained by the main theme.

The theme is released under the MIT license, allowing use, modification, commercial use, and distribution, but third-party assets such as demo images, fonts, and icons need to be checked separately for licensing; external services such as domains and hosting may incur additional costs.

HugoBlog

Is it right for your project?

Use Cases

  • Building a text-focused personal blog with Hugo
  • Needing a lightweight blog theme with built-in dark mode support
  • Wanting to copy the structure from the demo site and gradually replace it with your own content
  • Needing to inject custom CSS or branding styles without modifying the theme core

Suitable For

  • Developers using Hugo who prefer a minimalist blog appearance
  • Personal bloggers who want to start quickly from the demo site and then customize gradually
  • Blog sites that need automatic switching between light and dark color schemes
  • Projects that accept using the theme code under the MIT license and independently verify third-party assets

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Add the theme as a submodule: git submodule add https://github.com/janraasch/hugo-bearblog.git themes/hugo-bearblog

  2. 2

    Adjust the site configuration by referring to hugo.toml in the theme's exampleSite

  3. 3

    When starting from scratch, you can copy the contents of the exampleSite directory into the source directory as a starting point

  4. 4

    Run the demo site locally: hugo server --source ./exampleSite --themesDir ../..

  5. 5

    For custom styles, add custom_head.html under layouts/partials, write <style> or import custom.css

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version under the MIT license in the public repository; the free scope is the code of this version and does not mean external services or third-party assets are free.

Must comply with when using

  • The code of this version may be used, modified, used commercially, and distributed free of charge.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the complete MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Derivatives listed in the README, such as hugo-bearblog-neo and hugo-bearcub, are independently maintained by their respective authors, are not part of this theme, and their code and licenses must be checked separately.
  • The theme design references and credits the third-party Bear Blog service (bearblog.dev); that external service is unrelated to this theme's code, and using its hosting may involve separate terms and fees.
  • Demo images, fonts, icons, and other third-party assets must be checked under their respective licenses and cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur additional charges.
View Original Text Basis

Permission is hereby granted, free of charge

Original License Text

These are independent forks maintained by their respective creators.

Original README

A special thank you goes out to [Herman](https://herman.bearblog.dev), for creating the original [ʕ•ᴥ•ʔ Bear Blog](https://bearblog.dev/).

Original README
https://github.com/janraasch/hugo-bearblog/blob/master/LICENSEhttps://github.com/janraasch/hugo-bearblog/blob/master/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-01. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
More documented · 95 / 100
Technologies
Hugo
Website type
Blog
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2026-07-30
Screenshot last checked
2026-10-01

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Hugo as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Automatically checked against source and license rules; no manual editorial review.

Inspect the recorded source material

SHA-256: 57d67dc1d309b93ac6230a980dcee9e6678f86687500aec7fbdc6a3c7a99586d

2026-10-01T14:26:07.650Z

Source file / repository
# Hugo ʕ•ᴥ•ʔ Bear Blog [![CI](https://github.com/janraasch/hugo-bearblog/actions/workflows/ci.yml/badge.svg)](https://github.com/janraasch/hugo-bearblog/actions/workflows/ci.yml)

🧸 A [Hugo](https://gohugo.io/)-theme based on [Bear Blog](https://bearblog.dev).

> Free, no-nonsense, super-fast blogging.

## Demo

For a current & working demo of this theme, please check out https://janraasch.github.io/hugo-bearblog/ 🎯.

## Screenshots

⬜️ [Light][light-screenshot]

⬛️ [Dark][dark-screenshot]

When the user's browser is running »dark mode«, the dark color scheme will be used automatically. The default is the light/white color scheme. Check out the [`style.html`](https://github.com/janraasch/hugo-bearblog/blob/master/layouts/partials/style.html)-file for the implementation.

## Installation

If you already have a Hugo site on your machine, you can simply add this theme via

```bash
git submodule add https://github.com/janraasch/hugo-bearblog.git themes/hugo-bearblog
```

Then, adjust the `hugo.toml` as detailed below.

For more information, read the official [setup guide][hugo-setup-guide] of Hugo.

## Adjust configuration / hugo.toml

Please check out the [hugo.toml](https://github.com/janraasch/hugo-bearblog/blob/master/exampleSite/hugo.toml) included in the [exampleSite](https://github.com/janraasch/hugo-bearblog/tree/master/exampleSite) of this theme.

## Content & structure

### Starting fresh

If you are starting fresh, simply copy over the contents of the `exampleSite`-directory included in this theme to your source directory. That should give you a good idea about how things work, and then you can go on from there to make the site your own.

### Adding / editing content

#### Index-Page

The contents of the `index`-page may be changed by editing your `content/_index.md`-file.

#### Page

You can add **a new page** via running

```bash
hugo new my-new-page.md
```

#### Blog-Post

You can add **a new blog-post** via running

```bash
hugo new blog/my-new-post.md
```

### Adding your branding / colors / css

Add a `custom_head.html`-file to your `layouts/partials`-directory. In there you may add a `<style>`-tag, *or* you may add a `<link>`-tag referencing your own `custom.css` (in case you prefer to have a separate `.css`-file). Check out the [`style.html`](https://github.com/janraasch/hugo-bearblog/blob/master/layouts/partials/style.html)-file to find out which CSS-styles are applied by default.

## Remixes 🎭

The community has created some interesting variations of Hugo ʕ•ᴥ•ʔ Bear Blog. While the main theme stays true to the minimal Bear Blog philosophy, these remixes experiment with additional features:

* [Hugo ʕ•ᴥ•ʔ Bear Blog ✨ Neo](https://github.com/rokcso/hugo-bearblog-neo/) - Features Chinese documentation and an innovative "Toast" upvote system.

* [ᕦʕ •ᴥ•ʔᕤ Bear Cub](https://github.com/clente/hugo-bearcub) - A multilingual variant with experimental features like automatic social card generation.

_Note: These are independent forks maintained by their respective creators._

## Contributing & Community 🤝

Interested in contributing to Hugo ʕ•ᴥ•ʔ Bear Blog? Thanks for your interest!

- Check out our [Contributing Guidelines](CONTRIBUTING.md) for code contributions and bug reports
- [Share your story](https://github.com/janraasch/hugo-bearblog/issues/new/choose) if you're using the theme - we'd love to see what you've built!
- Have questions? You can find help in our [GitHub issues](https://github.com/janraasch/hugo-bearblog/issues) or the [Hugo Discourse](https://discourse.gohugo.io/)

We aim to keep this theme as simple and fast as the original [Bear Blog](https://bearblog.dev), while making it a friendly space for everyone to contribute and share their experiences.

## Development
Run the `exampleSite` locally via

```bash
hugo server --source ./exampleSite --themesDir ../..
```

In case you want to test functionalities and use hugo commands, in the root directory, you'll have to append `--source ./exampleSite --themesDir ../..` to them.

For example:

```bash
hugo new blog/post.md --source ./exampleSite --themesDir ../..
```

Same thing for pages:

```bash
hugo new page.md  --source ./exampleSite --themesDir ../..
```

## Special Thanks 🎁

A special thank you goes out to [Herman](https://herman.bearblog.dev), for creating the original [ʕ•ᴥ•ʔ Bear Blog](https://bearblog.dev/).

## License
[MIT License](http://en.wikipedia.org/wiki/MIT_License) © [Jan Raasch](https://www.janraasch.com)

[hugo-setup-guide]: https://gohugo.io/getting-started/installing
[light-screenshot]: https://raw.githubusercontent.com/janraasch/hugo-bearblog/master/images/screenshot.png
[dark-screenshot]: https://raw.githubusercontent.com/janraasch/hugo-bearblog/master/images/screenshot-dark.png
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.