Don’t know how to create a favicon?
You’ve come to the right place! This article will cover the function of favicons and why every website should have one. And while we’re at it, I’ll throw in the ten best favicon generators of my choosing to help you create a favicon from scratch.
To top it off, I will also include an easy tutorial on how to upload a favicon to your WordPress site.
Ready to give your site a personal touch? Let’s get to it then!
What’s a Favicon?
Favicon — also known as a tab icon or website icon — is a PNG and ICO icon, 16×16 and 32×32 pixels big, that is often associated with a particular website. You can see these small icons next to the site name in your browser’s address bar, bookmark list, and feed aggregators.
Since their first appearance in the Internet Explorer 5 bookmarking feature, favicons’ role has expanded and it became less of an attribute and more of a necessity.
Here are the essential reasons why your website should have a favicon.
Usability
When you open multiple tabs at the same time, the web browser tends to minimize them so as to fit in the available space. If your site has a favicon, the little icon will replace the site name’s role and act as the representative of your website.
This also applies for bookmarks made in mobile devices as favicons will appear on the home screen instead of the long site’s name. Therefore, you’ll get to increase your site’s usability which results in better user experience.
Brand Recognition
Favicons, after the site’s name, are the next thing people often associated with a brand. This is due to the fact that both of them appears in the address bar when a user visits your site.
Despite so, favicons have a more significant role than site names from the perspective of marketing. Images are more recognizable and memorable than words.
Given these points, a unique favicon will make your site stand out from the competition.
Credibility
Despite its small size, the appearance of a favicon in a site showcases the owner’s professionalism both in site management and branding.
In short, there’s no reason for you not to have a favicon on your website.
Top 10 Generators to Create a Favicon
Now that you how important it is to have a favicon on your website, it’s time to learn how to make one. Don’t worry, there are plenty of favicon generators to help you create a personalized icon for a reasonable price or, in some cases, even free.
To save your time, I took the liberty of creating a list of the ten best favicon generators that are worth using. Feel free to test them yourself and figure out which one works the best for your taste.
1. Favicon.cc
As a free favicon creator and generator, Favicon.cc gives you the freedom to get creative with your icon. You can build a favicon from scratch or import an existing logo as your base design. Not only that, Favicon.cc allows you to animate your favicon!
The Good
- Builder tools — Build your favicon from zero
- Plenty of image format options — Favicon.cc supports JPG, JPEG, GIF, PNG, BMP, ICO and CUR image formats
The Bad
- Mandatory open license — To obtain the HTML code, you have to publish the icon under an open license
The Verdict
If you want to build your own icon without spending a dime, Favicon.cc will be an ideal choice for the job. However, you might want to look at other options if you intend to trademark your brand. Otherwise, the open license will become a liability in the future.
2. Logaster.com
Considering that Logaster has created over five million logos, I’d say you can’t go wrong with it. All you need to do is input your brand’s name and choose one of the pre-made yet customizable templates.
While you can create small logos for free, you’ll need to buy their premium plan to get other benefits, like access to other image format and editing options. The prices of Logaster’s premium plans range between $5.99 and $18.99.
The Good
- Ease of use — Instantly create a favicon using the pre-made templates
- Additional corporate identity elements — Depending on your paid plan, you can incorporate your web and print logos to various business tools like social media banners, stationery designs, and brand books
- Online storage — Save your logo and edit on the go by creating a free account
The Bad
- Strict paywall — You’ll need to buy a premium plan to take full advantage of their features
- Limited image format options — The free plan only allows you to download small-sized PNG image format
The Verdict
Logaster provides an easy way to build premium-looking logos. However, it becomes clear pretty quickly that the paywall exists on every corner of the site. That being said, Logaster is a perfect choice if you’re planning to expand your business to the next level or have the budget to buy its premium plan.
3. Favicon-Generator.org
Favicon-Generator.org serves as a free easy-to-use favicon generator. All you need to do is upload a PNG, JPG, or GIF file and convert it to an ICO file. The convert tool is particularly useful for creating app icons for Web, Android, Microsoft, and iOS.
If you don’t have a logo to work with, you can explore the icon gallery and choose a pre-made icon which you can modify to your liking.
The Good
- Simple user interface — You can easily navigate through the page and access all features without having to make an account
- Auto-generate favicon files — It automatically provides all the necessary files and image sizes during the conversion process
- Icon gallery — Use an existing icon and modify it as necessary
The Bad
- Limited image format options — It strictly produces ICO files
The Verdict
Favicon-Generator.org is a great tool that could help you create favicon files from an existing image. However, this tool doesn’t facilitate the creation and editing process. So you’ll have to either use the existing icons provided by their gallery or make one using a third-party tool.
4. Genfavicon.com
Genfavicon couldn’t make the process of creating a favicon any simpler. The free online tool only requires you to upload a JPEG, GIF, or PNG image and choose the size of the favicon. The result is a neatly cut favicon icon in the form of an ICO file.
The Good
- Simple user interface — All that’s needed is included on a single page
- Preview feature — You get to see the result before downloading the ICO file
The Bad
- No builder tool — There’s no option to build a favicon from scratch
The Verdict
Genfavicon is ideal for creating a favicon out of an existing image. It’s very easy to use and gives exactly what it promises. That being said, users who don’t have an existing image won’t find this tool useful.
5. Favicongenerator.com
Favicongenerator.com works similarly to Favicon-Generator.org. The free online tool allows you to convert existing PNG, JPG, JPEG, or GIF images to ICO files within the size of your choice. You’ll save a lot of time with this tool as the converting process is quite straightforward.
The Good
- Ease of use — Create a favicon in just three simple steps
- Simple user interface — You can find everything you need in the home page
The Bad
- Image size limitation — The tool can only process images with a maximum size of 2MB
- No builder tool — There’s no option to build a favicon from scratch
The Verdict
Favicongenerator.com is the perfect option to choose if you’re in a hurry and already have the image. It also serves as an excellent substitution for Favicon-Generator.org if the latter is out of commission.
6. RealFaviconGenerator.net
RealFaviconGenerator has everything that you need to create the best possible favicon. This favicon generator allows you to convert image files to a favicon. In case the image isn’t square, the tool gives the option to fix it by adding a transparent background color.
The other feature that makes it stand out from the rest is the favicon checker. This feature allows you to check your current favicon regarding its compatibility across various platforms. Therefore, you can easily fix it accordingly and improve your site’s visibility. And did I mention it’s free?
The Good
- Smart conversion — Accepts non-square images and gives the option to fix them with a transparent background
- Platform-based conversion — Create favicons based on the selected platform
- Favicon checker — Make sure your favicon is compatible with all platforms
- Usage tutorial — See how you can put up the favicon on a site based on the development tool
The Bad
- No builder tool — There’s no option to build a favicon from scratch
The Verdict
While the favicon generator tool works great on its own, it’s the checker that takes the spotlight. Even if you already have a favicon, I highly recommend you take advantage of RealFaviconGenerator’s checker. The feature works wonders in maintaining your site’s visibility as it provides useful insights regarding your favicons’ compatibility across all platforms.
7. FavIcon.pro
FavIcon.pro is another great favicon generator that could help you create favicons for free. The online tool converts JPG, GIF, and PNG image formats to ICO files in three easy steps. If you have no experience with uploading a favicon to a website, FavIcon.pro provides a tutorial.
The Good
- Ease of use — Create a favicon in just three simple steps
- Usage tutorial — Newbies can easily follow the instruction without needing to find it from a third-party website
The Bad
- Limited image format options — It strictly converts images to an ICO file
- No builder tool — There’s no option to build a favicon from scratch
The Verdict
FavIcon.pro is ideal for turning image files into Desktop icons, App Icons, and favicons in a matter of seconds. Newbies can also benefit from the tutorial provided by the online tool.
8. Favicomatic.com
Favic-o-Matic lives up to its title as one of the best favicon generators which provide two different conversion options. You can either create 16×16 and 32×32 pixel ICO files or generate icons for all platforms for free. The online tool will also provide the HTML code needed for uploading the favicon to your site.
The Good
- Conversion options — You can generate ICO files or create a bulk of icons compatible with various platforms
- HTML codes — The generated favicons come with HTML code
The Bad
- No favicon builder tool — There’s no option to build a favicon from scratch
The Verdict
Favic-o-Matic will ensure that you have everything needed to give the proper representation for your site. The conversion options are especially useful in certain cases since you aren’t forced to download a bulk of icons for no reason.
9. Xiconeditor.com
X-Icon Editor is another favicon generator that allows you to create a favicon from scratch. The free online tool has all the tools required to make the creating process much easier and more flexible. You can also import an image and modify it using the available tools. Once you’re done, the result can be exported into an ICO file.
The Good
- Robust builder tools — The tools allow more complicated modification
- Import feature — Save your time by working on an existing image
The Bad
- Limited image format options — It strictly generates ICO files
The Verdict
If you want to create a favicon from scratch, X-Icon Editor is definitely worth considering. Its robust builder tools are a game changer as they allow you to create a more detailed favicon that suits you best.
10. Webestools’ Favicon Generator
Webestools’ favicon generator works similarly to Favicon.cc. You can easily create a favicon from zero or import an existing image and convert it to 16×16 or 32×32 pixel ICO file for free.
The Good
- Builder tool — Build your favicon from zero
- Preview feature — See how your creation looks in real size during the creating process
The Bad
- Limited image format options — It strictly generates ICO files in two different sizes
The Verdict
Unlike most favicon generators with a builder tool, Webestools’ favicon generator got the upper hand due to its live preview feature.
As you can see, each favicon generator has its pros and cons. Therefore, it’s best to choose one or a couple of them based on your needs.
How to Upload a Favicon to Your Site?
Now that you have a favicon, it’s time to upload it to your site. If you have a WordPress site, you can do so using the Customizer or a plugin like the Favicon by RealFaviconGenerator and Heroic Favicon Generator.
However, it’s important to know how to upload your favicon to the site manually in case you can’t use these methods.
Here’s how to manually upload a Favicon to your WordPress site:
1. Access your theme folder via an FTP. I recommend using FileZilla which is a free FTP client. To know more about FTP, you can check out this article.
2. Upload your favicon directly to the root directory of your site (/wp-content/themes/your-theme folder) or a new subfolder by the name of Assets which only stores favicons.
3. Access the header.php file or function.php file if your theme doesn’t have one.
4. If you’re using a PNG file, add the following code into the file.
function add_favicon() { echo ‘<link rel=”shortcut icon” type=”image/png” href=”‘.get_template_directory_uri().’/assets/favicon.png” />’; } add_action(‘wp_head’, ‘add_favicon’);
If you’re using an ICO file, use this code instead.
function add_favicon() { echo ‘<link rel=”shortcut icon” type=”image/x-icon” href=”‘.get_template_directory_uri().’/assets/favicon.ico” />’; } add_action(‘wp_head’, ‘add_favicon’);
The part after href= should be filled with the path to your favicon.
5. If the process is successful, your favicon should be up.
Summary
Having a favicon isn’t about showing off a meaningless icon. The small icon represents your site and brand when there’s no space for words to do it. Not only that, but it also enhances your site’s usability by ensuring great user experience for visitors across the platforms.
There are a lot of free favicon generators that could help you create one. Of all the ten best favicon generators listed above, here are three of my personal favorites.
- RealFaviconGenerator — offers platform-based conversion options and favicon checker tool
- Favic-o-Matic — generates icons and HTML code for multiple platforms simultaneously
- X-Icon Editor — has robust builder tools to create favicons from scratch
Considering favicon’s benefits and affordability, there’s no reason for you not to put one up in your site.
Leave a Reply