Free Tool
Favicon Generator
Upload a logo and instantly generate all favicon sizes — favicon.ico, PNG variants for Apple and Android, HTML tags, and a web manifest. Download everything as a ZIP.
Drop your logo here or click to browse
Supports PNG, JPEG, WebP, SVG · Square images work best
What gets generated
The tool renders your image at 7 sizes using the browser's Canvas API and packages everything into a ZIP:
- favicon.ico — multi-resolution ICO file with 16×16, 32×32, and 48×48 PNG images embedded. Used by browsers for the tab and bookmark icon.
- favicon-16x16.png, favicon-32x32.png, favicon-96x96.png — standard browser favicon PNGs.
- apple-touch-icon.png — 180×180 PNG used by iOS when a user adds your site to their home screen.
- android-chrome-192x192.png & android-chrome-512x512.png — used by Android browsers and PWA installers.
- html-tags.txt — copy-paste ready
<link>tags for your HTML<head>. - site.webmanifest — minimal web app manifest referencing the Android icons.
Tips for best results
Use a square PNG or SVG with a transparent background as the source image. Avoid logos with lots of fine detail — favicons are tiny and detail is lost at small sizes. A simple symbol or letter mark works much better than a full wordmark.
How to use
- Upload your logo — PNG, JPEG, WebP, or SVG. Square images give the best result.
- Click Generate Favicons. All processing runs in your browser.
- Copy the HTML tags from the HTML Tags section and paste them into your
<head>. - Click Download favicons.zip to get all files.
- Extract the ZIP and put all files in the root public directory of your site (e.g.
/publicin Next.js).
All generation happens in your browser using the HTML5 Canvas API — no image is uploaded to any server.
Frequently Asked Questions
- What sizes does the favicon generator produce?
- The tool generates 7 PNG files (16×16, 32×32, 48×48, 96×96, 180×180, 192×192, 512×512) and a favicon.ico that embeds 16×16, 32×32, and 48×48. It also includes a site.webmanifest and ready-to-paste HTML tags.
- What image formats can I upload?
- PNG, JPEG, WebP, and SVG are all supported. Square images work best — rectangular images will be stretched to fill each square canvas.
- Is my image uploaded to a server?
- No. All processing happens entirely in your browser using the HTML5 Canvas API. Your image is never sent to any server.
- Where do I put the files in my project?
- Place all files in the root public directory of your project (e.g. /public in Next.js). Then paste the HTML tags from html-tags.txt into the <head> of your HTML.
- What is site.webmanifest for?
- The web manifest tells Android browsers and PWA installers which icons to use for your app. Place it in your web root and link to it via <link rel="manifest" href="/site.webmanifest">.