A favicon is the tiny icon in browser tabs, bookmarks, history and Google's mobile search results, and the larger version people see when they add your site to a phone's home screen. Without one, your site shows a generic blank icon that looks unfinished. This free favicon generator creates the full modern set from either your own image (a logo, works best when square) or from text: one to three letters or an emoji on a coloured background, with a choice of shape (square, rounded or circle), font weight and colours. That's perfect for a quick, clean brand mark. The live preview shows your icon at real sizes in a mock browser tab, so you can check it's still readable at 16 pixels, which is where detailed logos usually fail. Then download a multi-size favicon.ico (16, 32 and 48 px in one file, generated by our own ICO writer), PNGs at 16, 32, 180 (Apple touch icon), 192 and 512 (Android and PWA), and a ready-made site.webmanifest. Copy the HTML snippet into your page's <head>. On Blogger, use Theme → Customise → Favicon with the 32 or 48 px PNG instead. Images are processed on a canvas in your browser and never uploaded.
Create your favicon
How to add a favicon
- Design it here and download favicon.ico plus the PNGs.
- Upload them to your site’s root folder.
- Paste the HTML into your <head>.
- Hard-refresh; browsers cache favicons aggressively.
FAQ
What size should a favicon be?
Provide several: 16 and 32 px for tabs, 48 px in the .ico, 180 px for Apple, and 192/512 px for Android.
Why does my logo look blurry at 16 px?
Detail disappears at that size. Use a simple mark or one or two letters for the favicon.
Will Google show my favicon?
Google uses a favicon at least 48×48 px that’s crawlable. It can take a while to update.
Is my image uploaded?
No. Everything is drawn on a canvas in your browser.
Comments
Post a Comment