Favicon Generator
A favicon generator turns a single source image into the small icon set every browser, phone, and search result needs: the tiny mark in a browser tab, the apple-touch-icon iOS uses for a home-screen shortcut, and the larger PNGs Android and progressive web apps reference from a manifest. Getting the sizes and the matching <link> tags right is a small but visible trust signal, because a missing or stretched favicon is one of the first things a careful visitor notices.
This tool is free and runs entirely in your browser. Upload a square image and it draws it onto a canvas at each standard size, lets you preview and download every PNG, and prints the exact link tags and web manifest entries to paste into your site. Nothing is uploaded to a server.
Choose an image to begin. It is decoded and resized entirely in your browser.
🔒 Private: everything runs in your browser. Nothing you paste is uploaded.
This outputs modern PNG favicons plus the matching <link> tags and manifest entries. PNG favicons are the current cross-browser standard. A legacy multi-resolution favicon.ico needs a packaging library, so it is intentionally not produced here.
How to use the favicon generator
Pick a square source image, choose whether to keep transparency or fill a background, select the sizes you need, then preview and download each PNG and copy the generated markup.
Start with a square, high-resolution source
Favicons are scaled down from one master image, so the quality of every output depends on the source you feed in. Supply a square image at 512 by 512 pixels or larger, ideally a transparent PNG or a crisp SVG, so the smallest 16 pixel icon stays legible and the 512 pixel manifest icon stays sharp. A non-square image is contain-fitted and centred rather than stretched, which avoids distortion but leaves padding, so the tool flags it. Simple, high-contrast marks read far better at 16 pixels than detailed logos with fine text.
Choose transparency or a solid background per platform
Modern browser-tab favicons look best with a transparent background so the mark sits cleanly on any theme. Apple touch icons are the exception: iOS paints them on a solid rounded tile and renders any transparent area as black, so this tool always fills the 180 pixel apple-touch-icon with a background even when the rest stay transparent. If your icon needs a consistent colour everywhere, switch the background option to a fill and pick the colour that matches your brand or interface chrome.
Ship the PNGs with the matching link tags
Downloading the images is only half the job; browsers need to be told where they live. The tool generates the precise <link rel="icon"> and <link rel="apple-touch-icon"> tags for the sizes you selected, plus a small web manifest snippet for the 192 and 512 pixel icons that Android and installable web apps use. Place the PNG files in your site root, paste the tags into the page head, reference the manifest, and the full icon set resolves consistently across desktop, mobile, and search.
Favicon generator frequently asked questions
Q1What favicon sizes do I actually need?
A practical modern set is 16, 32 and 48 pixel PNGs for browser tabs and Windows, a 180 pixel apple-touch-icon for iOS home screens, and 192 and 512 pixel PNGs referenced from a web manifest for Android and installable apps. This tool generates all six by default, and you can untick any you do not need. The link tags and manifest snippet update to match exactly the sizes you keep.
Q2Does this favicon generator create a .ico file?
No, and that is deliberate. It produces modern PNG favicons, which every current browser supports and which are now the standard approach. A legacy multi-resolution favicon.ico requires a dedicated packaging library that bundles several bitmaps into one container. PNG icons referenced through link tags cover the same use cases without that overhead, so this tool focuses on producing correct, ready-to-use PNGs and the markup that points to them.
Q3Is my image uploaded anywhere?
No. The image is read with the browser FileReader API, decoded locally, and redrawn onto an HTML canvas entirely on your device. No file is sent to a server, nothing is stored, and the tool keeps working with the network disconnected once the page has loaded. That makes it safe to use with unreleased logos, client branding, or any image you would rather not upload to a third-party service.
Q4Why does my apple-touch-icon look like it has a black background?
iOS does not support transparency in home-screen icons. Where your PNG is transparent, the system fills it with black, which can look like an unwanted dark box. To prevent that, this tool always paints a solid background behind the 180 pixel apple-touch-icon. If you want a specific colour rather than white, switch the background option to a fill and choose your brand colour before downloading.
Q5My logo is not square. Can I still use it?
Yes. A non-square image is scaled to fit inside each square canvas and centred, so it is never stretched or distorted, but it will sit inside transparent or coloured padding. The tool detects this and shows a warning. For the cleanest result, crop or pad your artwork to a square before uploading, or enable a background fill so the padding becomes an intentional part of the icon rather than empty space.
