Favicon Generator
Turn one image into a complete favicon set — every PNG size and a real multi-size favicon.ico — bundled in a zip with the HTML snippet. All built in your browser.
Every icon and the .ico are built in your browser — nothing is uploaded.
How it works
Your image is drawn onto a <canvas> once for each required size, scaled
to fit and centred so it is never stretched. Each canvas is exported as a PNG. To build
the favicon.ico, the tool writes the ICO container format by hand — an icon
directory header followed by entries that wrap the 16, 32 and 48 pixel PNGs — which is the
modern, widely supported way to store an icon. Finally a small zip library is loaded on
demand to pack everything, including the HTML snippet, into a single download. All of this
runs locally, so your artwork is never sent anywhere.
How to generate a favicon
- Upload a square image, ideally 512×512 or larger.
- Click Generate favicons to render every size and the .ico.
- Download the zip, or grab individual PNG and ICO files.
- Copy the HTML
<link>snippet into your page<head>. - Upload the files to your site root and reload.
Why build favicons locally
A favicon is the tiny icon in the browser tab, the bookmark bar and the phone home screen when someone installs your site. Getting it right means shipping several sizes: small ones that stay legible in a 16-pixel tab, larger ones for high-density displays, an Apple touch icon for iOS, and 192/512 versions that a Progressive Web App uses for its launcher. Doing this by hand in an image editor is fiddly and easy to get subtly wrong.
Most favicon services upload your logo to their servers to generate the set. For a brand
that has not launched yet, or any private project, that is an unnecessary leak. This
generator does the rendering, the ICO encoding and the zipping entirely in your browser, so
your mark stays on your machine. When you are done, the included <link>
snippet wires the icons into your <head> in one paste. Need to prepare
the source art first? Try the resizer or
cropper to square it up.
Related tools
Frequently asked questions
What favicon sizes do I actually need?
A practical modern set is 16×16 and 32×32 for browser tabs, 48×48 for some desktop shortcuts, 180×180 for the Apple touch icon, and 192×192 plus 512×512 for Android and PWA installs. This generator produces all of them, plus a favicon.ico that bundles the 16, 32 and 48 sizes.
Is the .ico a real multi-size icon?
Yes. The .ico is assembled in your browser as a genuine ICO container holding the 16, 32 and 48 pixel PNG images, so a browser can pick the crispest size for each context. It is not just a renamed PNG.
Are my images uploaded to make the favicons?
No. Every size is rendered with the Canvas API and the .ico bytes are built locally; the zip is packed in your browser too. Your logo never leaves your device, which matters for unreleased brands and private projects.
What image should I upload?
Use a square image at 512×512 or larger for the sharpest result. A simple, high-contrast logo or mark reads best at 16 pixels. Non-square images are centred and scaled to fit without stretching, leaving transparent padding where needed.
Where do I put the files and the snippet?
Upload the PNGs and favicon.ico to your site’s root (or an /icons folder, adjusting the paths) and paste the provided <link> tags into the <head> of your HTML. The snippet covers the tab icon, the .ico fallback, the Apple touch icon and the web manifest.
Does the favicon support transparency?
Yes. All PNG sizes are exported with their alpha channel intact, so rounded or transparent logos keep clean edges on light and dark browser themes alike.
Image Tools generates favicons entirely within your browser. Files are never uploaded.