What Is a Favicon?

Learn about Favicons and how you can add them to your website.

Even if you don't know favicons by name, you know what they are. But what is a favicon? A favicon is a small website icon that is usually displayed in a browser's address bar, next to the URL of a site.

For example, Wikipedia's favicon is a capital W on a plain white background. If you want to design a good website, you need to put some thought into the favicon that will follow it everywhere. Every time someone opens your website in a browser tab, types its URL into an address bar, or adds it to their bookmarks, they'll see it. That tiny graphic that accompanies your website's title is an essential part of your online image, so don't neglect it or settle for something generic. Put the right finishing touch on your website by selecting or creating a favicon that's fit to represent your website.

1. Easy way to brand yourself

What better way to start building your brand identity than by giving yourself a logo? The favicon is every website's constant companion, and it's a reflection of the website in every way: style, color, and creativity factor. Most businesses, publications, and online retailers have a simple and easily recognizable logo that doubles as their favicon; think fast food arches and the Google "g".
However, if you don't have or need a logo, your favicon is the closest you'll get to branding yourself. It will follow your website everywhere, making sure it doesn't get lost among other tabs or bookmarks, so it's your job to make sure it pops.
If you have a niche website with a clear topic or theme, you might want to consider a simple and easy-to-recognize graphic that doesn't need very much detail. For example, one fashion retailer uses a stylized handbag, and an online music streaming service has a favicon that resembles a tiny radio.

2. Create your own favicon

You don't have to be a graphic designer to create a favicon of your very own. Because favicon size is limited to the pixels that fit in browser tabs and tool bars, you can create something simple on a larger scale before shrinking it back down for use. And if you do decide to design your own favicon, you can be sure your website always stands out. Instead of picking from a gallery of favicons that are generic or recognizable, you can brand your website with its very own favicon. This unique graphic can be your website's logo, your initials, or anything else that represents the spirit and purpose of the site.
There are multiple free favicon generators, but the most comprehensive is Favicon.cc. You can even pick from a gallery of thousands of open source favicons, open them up in larger scale, and tweak them to get a feel for the favicon-creation software. Add tweaks to a set of initials, borrow some simple geometric shapes and change their colors, or play with the generator until you've created a tiny logo that works for you.
SITE123 offers a favicon tool that creates an automatic favicon for every website. Activate it and play with the settings to see what we can create for you, or take matters into your own hands and teach yourself how to design a favicon of your own.