Last updated on November 12th, 2026 at 07:09 pm
Favicon Generator
By Digital Mansoor, 14+ years in SEO. Updated November 2026.
Upload a logo or type a letter, pick a shape and colours, and download a full favicon package: favicon.ico, PNG icons, an Apple touch icon, a web manifest and the HTML to paste into your head.
- Free, no signup
- 9 files in one run
- Zip download
- Head snippet
Rate this tool
No ratings yet. Click a star to rate this tool.
Make a favicon set from a few letters and paste the head snippet
Type a site name and one to three letters, pick a shape, colours and font, and the tool builds a favicon.ico, PNG icons, a web manifest and the HTML to paste into your head.
A favicon looks like a small job and then fails in five places. The browser tab wants 16 and 32 pixel icons. Search results use a favicon too. iPhones want a 180 pixel touch icon. Android home screens want 192 and 512 pixel icons listed in a manifest. This tool outputs all of them in one run, with a snippet that links each file.
You set the site name for the manifest, the letters, the shape (square, rounded square or circle), the background and text colours as hex codes, the font and the padding as a percent. An option makes the 16, 32 and 48 pixel files transparent. A preview shows the icon at real size, from 16 pixels up to 180, so you can see whether the letters survive at tab size.
The result lists each file with its size and a download button, plus a download all as zip button. The snippet panel gives the link tags to paste into the head of your site. You still upload the files to your site root yourself.
- Three shapes, four fonts
- Hex colours and padding
- Transparent option
- Live preview at 16, 32, 48 and 180 px
- Zip download
- Free, no signup
Make a favicon set in four steps
The preview updates as you type. Ctrl+Enter also works.
- Load an example or start blank. Choose a brand lettermark or a green circle, or reset.
- Enter the name and letters. The site name goes into the web manifest. The letters, 1 to 3, are used when no image is chosen.
- Style the icon. Pick a shape, a background colour, a text colour, a font and the padding. Check the 16 pixel preview.
- Download and install. Download the zip, upload the files to your site root, then paste the snippet into your head.
| Field | What it does |
|---|---|
| Site name | Used in the web manifest. |
| Letters | 1 to 3 characters drawn on the icon. |
| Shape | Square, rounded square or circle. |
| Background and text colour | Hex codes such as #6B352A. |
| Font | Arial, Georgia, Trebuchet MS or Courier New, all bold. |
| Padding | 0 to 35 percent of the icon. |
| Transparent option | Transparent background on 16, 32 and 48 px files. |
One real run on the brand lettermark example
I loaded the brand lettermark example: site name Digital Mansoor, letters DM, rounded square, background #6b352a, white text, Arial, 12 percent padding. The transparent option was off.
The tool produced 9 files from the letters source, with ICO sizes of 16, 32 and 48. The file sizes are real figures from the run. The snippet it gave links the ico, the 48, 32 and 16 pixel PNGs, the apple touch icon, the manifest and a theme colour taken from the background.
| Field | Value |
|---|---|
| Site name | Digital Mansoor |
| Letters | DM |
| Shape | Rounded square |
| Colours | #6b352a on white |
| Font and padding | Arial, 12 percent |
| File | Size |
|---|---|
| favicon.ico | 2.9 KB |
| favicon-16×16.png | 0.5 KB |
| favicon-32×32.png | 0.9 KB |
| favicon-48×48.png | 1.5 KB |
| apple-touch-icon.png | 4.5 KB |
| android-chrome-192×192.png | 4.9 KB |
| android-chrome-512×512.png | 17.5 KB |
| site.webmanifest | 0.4 KB |
| html-snippet.txt | 0.4 KB |
What each file is for
Names come from the real run.
favicon.ico
The classic file that holds the 16, 32 and 48 pixel sizes. Browsers still request it at your site root.
favicon 16, 32 and 48 PNGs
Tab and bookmark icons for modern browsers, linked in the snippet.
apple-touch-icon.png
The 180 pixel icon iPhones and iPads use when someone adds your site to the home screen.
android-chrome 192 and 512
Larger icons for Android and installable web apps, listed in the manifest.
site.webmanifest
A small JSON file with your site name and the icon paths.
html-snippet.txt
The link tags and theme colour meta tag to paste into the head of your site.
What this tool does not do
Check these before you ship.
Letters only in my test
I tested the letters source. The page text mentions “when no image is chosen”, but I did not find an upload control in my probe, so I cannot confirm image upload.
Four fonts, bold only
Arial, Georgia, Trebuchet MS and Courier New, all bold. A custom brand font is not available.
You upload the files
The tool does not install anything. Put the files in your site root and paste the snippet.
Caching hides changes
Browsers cache favicons hard. After you replace the file, you may need to clear the cache or wait.
Search display is Google’s call
A favicon in search results depends on Google’s own rules and crawling. I cannot promise yours will show.
Tiny sizes need big letters
At 16 pixels, three letters are hard to read. Use one or two and low padding.
Where it helps
New site owners
Get a full favicon set without opening a design tool.
WordPress and static site builders
Paste a head snippet and upload the files to the root.
Agencies
Produce a quick placeholder icon set for a client site.
Developers
Get the manifest and touch icon files in one zip.
This tool, a design tool and a plugin
Each has a place.
| Option | Best for | Weakness |
|---|---|---|
| This generator | A full set from letters in a minute | No custom artwork in my test |
| A design tool | A logo based icon | You must export every size and write the manifest |
| A CMS plugin | One click setup inside the CMS | Tied to that platform |
| LLMs.txt generator | Another root file for AI tools | Different job |
How this page was checked
From my SEO work
I add favicon sets to sites and know which files get requested.
Run on a real sample
The nine files and their sizes come from one live run on the brand lettermark example.
Limits stated up front
I say what I did not confirm, such as image upload and how Google shows your icon.
Favicon Generator FAQ
Quick answers on files, sizes and installing the icons.
What does the favicon generator do?
It builds a favicon.ico, PNG icons, a web manifest and a head snippet from a site name, letters, a shape, colours and a font.
Is it free?
Yes. There is no signup.
How many files does it make?
Nine in my run: the ico, three small PNGs, the apple touch icon, two Android icons, the manifest and the snippet text.
Which icon sizes does it make?
16, 32, 48, 180, 192 and 512 pixels, with the ico holding 16, 32 and 48.
Can I use my own logo image?
I could not confirm it. The tool works from letters, and I did not find an upload control in my test. Check the page yourself.
What shapes and fonts can I use?
Square, rounded square or circle, and Arial, Georgia, Trebuchet MS or Courier New, all bold.
How do I set colours?
Enter hex codes for the background and the text, such as #6B352A.
What does the transparent option do?
It makes the background transparent on the 16, 32 and 48 pixel files.
Where do I put the files?
In your site root, so they load at yourdomain.com/favicon.ico and the other paths in the snippet.
Where does the snippet go?
Inside the head of your pages. Paste it as given.
Why does my old favicon still show?
Browsers cache favicons for a long time. Clear the cache or test in a private window.
Will my favicon show in Google results?
I cannot promise that. Google decides what to show, so make sure the file is crawlable and the snippet is in place.
What is the web manifest for?
It tells Android and installable web apps your site name and where the icons are.
Why do three letters look bad at 16 pixels?
There is too little room. Use one or two letters and reduce the padding.
Does the tool upload my data?
The tool runs in your browser. I read this page’s code for network calls and found none that send your input to my server. If the page has a Share link, it puts your input in the web address after the # sign, and Save keeps it in this browser only, so do not share a link that holds private text. Normal site analytics can still record the page visit.
What should I use next?
Add a robots file and sitemap, then check your social previews.
Want this done for your site?
Send your URL on WhatsApp and I will tell you what to fix first.
Message me on WhatsAppNeed more than a free tool? See my technical SEO consulting and on-page SEO consulting work.
Need more than a free tool?
See my freelance SEO consulting and SEO for small business work.
Leave a Reply