How to Create a Free and Easy Online Blog Favicon Without Installing Anything

Hello guys. This post we will discuss how to make a favicon blog online and the size of the favicon that exists. Listen to it until it’s over.

Definition of Favicon

Before we discuss how to make a favicon online, we need to know first what a favicon is. There may be friends who don’t know what a favicon is.

A favicon is a small square-shaped image that generally has a .ico format used as an icon of a blog or website. The favicon is located to the left of the web browser tab.

This favicon is useful for adding to the identity of the blog and indicates that it is an icon of the blog. It’s even cooler if when you open a blog, in the web browser tab there is a blog icon. So it’s more typical.

How to Create a Blog Favicon

How to make it is also not difficult. Can use graphic design software, can also use online tools as will show this. So, keep checking out how to make an online favicon until the end of the post.

The name of the tool is Favicon Generator. This tool will generate an icon image from the uploaded image. So, we have to prepare the picture that we want to make as a favicon.

For the result to be good, the shape of the image must be square. If you have, open the favicon generator in Can also type in google search “favicon generator”. The tools will appear at the very top.

Baca Juga:  Cara Membuat Table of Content di Blogspot

 When it is opened, this is the look of the tools.

Select the image you want to make a favicon. Then select Generate only 16×16 favicon.ico. If you have, click the Create Favicon button. The tools will generate the favicon from the uploaded image.

The tergenerate favicon can be downloaded by clicking Download the generated favicon. Check out the image circled in red below.

And the favicon results like this.

It’s done. So so how to create a blog favicon with favicon generator online tools. It’s free and doesn’t need to install any apps. The favicon is already instantly made. It’s easy, isn’t it?

Unfortunately, the image that will be used as a favicon must be prepared first. This tool is not a favicon maker from scratch, but rather creates a favicon from an existing image.

In addition to the Favicon Generator, AneIqbal also recommends It’s more or less the same. Upload the image you want to make a favicon, select the .ico option or all sizes. Then download the generate result.

Most of the files were uploaded in the past and then used to be a favicon. But there are also kok who make faviconnya online (do not upload pictures) such as and

Favicon Size

The size of the favicon actually varies. Even so, the length and width are always the same which eventually form a square.

For .ico format, unfortunately it does look blurry when reviewed. The resolution is only 16 x 16px. So far, there has been no resolution greater than that for the .ico format.

Baca Juga:  Review Update WordPress 5.8 by Yos Beda

There are other formats where the resolution varies, namely .png. From 16 x 16px to hundreds of pixels. Here are some examples of other favicon sizes.

  • 16×16
  • 32×32
  • 36×36
  • 48×48
  • 57×57
  • 60×60
  • 70×70
  • 72×72
  • 76×76
  • 96×96
  • 114×114
  • 120×120
  • 144×144
  • 150×150
  • 152×152
  • 180×180
  • 192×192
  • 310×310

Of course, the larger the resolution, the better the favicon look. Tools Favicon Generator that we have discussed earlier can also produce a lot of resolutions you know. It’s not just .ico files.

The trick, on the image upload page to be used as a favicon in the previous step, the option we choose is Generate only 16×16 favicon.ico. Well, this time, the options selected are the ones below, namely Generate icons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps.

Then generate, then download the result. You will be able to compress files in .zip format. It contains a favicon file in .png format in a variety of resolutions.

So, how do I install the favicon?


How to Install a Favicon

How to install a favicon for our blog or website is easy. Moreover, the blogging platform uses Just honk-click just go straight to the finish.

For platform, this way. Click the Settings menu, and then keep it on the Basic section. Click on the Favicon link. A new tab opens, then selects the favicon file, and clicks the Save button. finish.

For websites, all you have to do is edit the file. Especially on the <head>and </head>.

After we download the favicon compress file, upload one of the files to your website server/hosting (usually in the public_html folder).

Baca Juga:  Cari Domain Gratis? Berikut Daftar Provider Penyedia Domain Gratis Terbaik!

Then, you add the following script between <head>and </head>Do not forget to adjust the image you chose & the location of the image on the server / hosting ya.


<link rel=“icon” type=“image/png” sizes=“32×32” href=“/favicon-32×32.png”>

Finally, save the file. Now try your blog/website, then press the Ctrl+Shift+R (Mozilla Firefox) key combination for a hard refresh.

The goal is to clear the cache &cookies that have been stored when accessing your blog/ website. If you had, the favicon would have changed.

Thus our post this time about the understanding of favicon, how to create a favicon blog online, various sizes of favicons, and how to install a favicon. Hopefully useful for those of you who read to the end. thanks.

Gunakan Jasa Kami: Jasa Penulis Artikel SEO


Tinggalkan komentar