Favicon generator: make ICO, PNG and Apple touch icons in your browser
What a favicon set contains, how the free AyeTab Favicon Generator builds it from one image, and why the image never leaves your computer.
By ClaudeGPT Si Newsroom, Editorial team
3 min read
A favicon generator takes one image, usually your logo, and turns it into the set of small icons browsers, phones and search engines look for. The AyeTab Favicon Generator does it free in your browser: drop in an image and download the favicon.ico, the PNG sizes, the Apple touch icon, a web manifest and the HTML tags.
Why one icon file is not enough
The favicon started as a single tiny icon in the bookmarks list. Today the same mark shows up in several places, and each one asks for a different file:
- the browser tab and address bar, which want small icons
- the home screen of a phone, when someone saves your site
- the install prompt of a web app, which reads the manifest
- the Google results page, next to your site name
Making each size by hand in an image editor is slow and easy to get wrong. A generator scales your image once, to every size at the same time, and writes the files with the names your HTML expects.
What the AyeTab Favicon Generator makes
Once you add an image, the page previews it at every size from 16 px up to 512 px. Under Options you can adjust the result before you download anything.
| Output | What it is for |
|---|---|
| favicon.ico | The classic fallback file, holding 16, 32 and 48 px versions |
| PNG icons | Separate files from 16 px to 512 px, named like favicon-32x32.png |
| 180 px PNG | The Apple touch icon for iPhone and iPad home screens |
| site.webmanifest | Points to the 192 px and 512 px icons for installable web apps |
| Copy HTML | The link tags to paste into your page head |
The options are short and practical. Padding adds space around the logo so it does not touch the edges. Corner radius rounds the square, from sharp to a full circle. You can keep a transparent background or fill it with a colour, and that colour also goes into the manifest as the theme colour.
How to make a favicon in four steps
- Open the favicon generator and drop or paste a square image. A simple, bold logo works best, because detail disappears at 16 px.
- Look at the small previews. If the mark looks cramped, add some padding. If you want a tile behind it, turn off the transparent background and pick a colour.
- Download favicon.ico, the PNGs and the manifest, and put them in the root folder of your site.
- Press Copy HTML and paste the tags inside the head of your pages.
That is the whole job. There is no account to create, no watermark on the files and no upload queue to wait for.
Your logo stays on your machine
Before you drop an unreleased logo into a website, it is fair to ask where the file goes. AyeTab draws every size on a canvas inside your browser, so the image never leaves your computer. That matters when the logo belongs to a client or to a product that has not launched yet. It also means the page keeps working offline once it has loaded.
The same tool lives in the AyeTab Chrome extension, which puts its developer tools on your new tab page and in a side panel. Press Ctrl+K or Cmd+K, type "favicon", and the generator opens.
When another tool is the better pick
If you want an SVG favicon, or previews of how iOS and Android will show your icon, RealFaviconGenerator covers those cases. If you have no logo yet and want an icon made from letters or an emoji, favicon.io has modes for that. For turning an existing image into a complete favicon set quickly and privately, AyeTab is the one to open.