Favicon Generator
Upload a logo, download a complete favicon package — .ico, every PNG size, apple-touch-icon, a web manifest and the HTML to paste. All made in your browser.
Favicon package
- favicon.ico16 + 32 + 48 in one file
- favicon-16x16.pngBrowser tab
- favicon-32x32.pngTaskbar / tab @2x
- favicon-48x48.pngWindows shortcut
- favicon-64x64.pngHiDPI tab
- favicon-128x128.pngChrome Web Store
- apple-touch-icon.pngApple touch icon
- favicon-192x192.pngAndroid / PWA
- favicon-512x512.pngPWA splash
- site.webmanifestPWA / Android
What this tool does
Give it a logo and it renders every size a website needs, assembles a multi-resolution favicon.ico, writes a starter site.webmanifest, and bundles everything into a single ZIP with a README containing the <link> tags. The preview shows the small sizes at actual pixel size and a mock browser tab, so you can see whether your mark still reads at 16 px before you download.
How to install the package
- Unzip and upload all the files to the root of your site (so
https://yoursite.com/favicon.icoworks). - Paste the HTML from the README — or the Copy button above — into the
<head>of every page (usually your layout template). - Open
site.webmanifestand change the name, colours and start URL to match your site. - Hard-refresh; browsers cache favicons aggressively, so you may need to open the site in a private window to see the change.
Getting a good small icon
- Start square, 512 px or larger, PNG or SVG. The tool downsizes in halving steps for sharper results than a single jump.
- Simplify: at 16 px only a bold shape or one or two letters survive. Wordmarks do not.
- Fill the canvas. Padding inside the source image is wasted pixels at small sizes; let the tool pad non-square logos instead.
- Check contrast against both light and dark tab bars. Transparent backgrounds are ideal; if your mark is white, pick a coloured or black padding background.
Frequently asked questions
What do I get in the ZIP?
A multi-size favicon.ico (16, 32 and 48 px in one file), PNGs at 16, 32, 48, 64, 128, 192 and 512 px, apple-touch-icon.png at 180 px, a starter site.webmanifest, and a README with the exact <link> tags to paste into your <head>. Upload the files to your site root and you're done.
What sizes does a favicon need in 2026?
Practically: a favicon.ico for legacy and address-bar use, 32 px PNG for modern tabs, 180 px for iOS home screens, and 192 + 512 px for Android and PWA installs. Anything else is optional. This tool makes all of them, plus 48/64/128 for Windows shortcuts and browser extension stores.
My logo isn't square — will it be stretched?
No. Non-square images are centred on a square canvas and padded, never stretched. You choose the padding: transparent (default), white or black. For best results start from a square SVG or a PNG of at least 512 px.
Do I need an .ico file any more?
Mostly for the address bar in some browsers, for bookmarks in older software, and because a lot of tooling requests /favicon.ico by convention. It costs nothing to include, so the ZIP has one. The PNG <link> tags take precedence in modern browsers.
Is my logo uploaded?
No. The page is static; every size is rendered by your browser with the Canvas API, and the ZIP and ICO are assembled in memory on your device. That makes this safe for logos under NDA or not yet launched.
How is this different from RealFaviconGenerator or favicon.io?
Those services upload your image to their servers to render the sizes. AI-Pix does the same job locally and gives you the complete package in one click. RealFaviconGenerator offers more platform-specific options (Windows tiles, Safari pinned tabs, per-platform padding); if you need those, it's a good tool — just be aware your logo leaves your machine.