indexcosmos blog Make something great!

Make a Favicon with GIMP

A favicon or favorite icon is also known as a bookmark icon, web site icon, shortcut icon or tab icon. The favicon is displayed on browser tabs and next to a page's name in a list of bookmarks. When designing a favicon, think of it as an opportunity for a site to feature it's unique characteristics through graphic brand.

In this post we’ll be working with GIMP, the GNU Image Manipulation Program. A basic understanding of graphic software will be helpful, although not necessary.

Tutorial Requirements:

Step 1. Make your Brand

The favicon made can be simply letter typography or an outlined image that bests repersents the style and branding of the site.

Step 2. Make a Favicon

Start up GIMP and navigate to File > New to create a new image. Adjust the new image size to 16 x 16 pixels. Below, select portrait for page orientation. I am going to make my favicon transparent by selecting the Advanced Options tab and set Fill with to Transparency. Pressing ok will load an artboard to draw the new favicon on.

GIMP New Image

Step 3. Save your Favicon

Export the favicon with the .ico or icon file extension.