Overview

This article explains a simple method to create a favicon. It also covers how to display a favicon in Hugo.

What is a Favicon?

A favicon is an icon that appears in bookmarks, tabs, and home screens for websites. Google has published guidelines for favicons that appear in search results. Adhering to these guidelines can help your favicon appear in search results.

Creating a Favicon

To create a favicon, use the following site:

• Favicon.ico & App Icon Generator

When you visit the site, you’ll see a screen like this.

Enter the URL of the site you want a favicon for and click on Generate Favicon. Then, on the displayed screen, click the ‘Download the generated favicon’ link to download the favicon.

Displaying a Favicon in Hugo

To display a favicon in Hugo, the process varies depending on the theme. For the bearcub theme, you can simply set it in the toml like this:

1
2

[params]
  favicon = "images/favicon.ico"

Summary

This article explained how to create a favicon and display it in Hugo. Favicons are displayed in bookmarks, tabs, and home screens, so it’s a good idea to create one for your blog.