Favicon Generator
Drop one image, get every favicon size, an .ico file, and a web manifest, packaged in a zip.
Processed entirely in your browser. Never uploaded to a server.
Drop a logo or icon image here or click to browse
Processed entirely in your browser. Never uploaded to a server.
Paste this into your <head>
Upload the extracted zip contents to your site root (or wherever these paths point) so the referenced files resolve.
This tool turns one source image into a complete favicon and app-icon set, packaged as a single zip.
Drop a logo or icon image above. Six PNG sizes, a favicon.ico, and a site.webmanifest file are generated and downloaded automatically once ready.
What's actually in the zip, and why so many sizes
A single low-resolution image looks blurry the moment a platform asks for a size bigger than what you gave it — a browser tab, an iOS home screen icon, and an Android/PWA install icon all request different pixel dimensions, and each one upscales a too-small source rather than asking twice. This tool renders each size fresh from your original image instead of stretching one small PNG, so every context gets a crisp icon:
- favicon-16x16.png, favicon-32x32.png — the browser tab icon (32 covers retina displays).
- favicon-48x48.png — Windows taskbar/shortcut size.
- apple-touch-icon.png (180×180) — the icon iOS shows when a page is added to the home screen.
- android-chrome-192x192.png and android-chrome-512x512.png — Android home screen and PWA install icons.
- favicon.ico — a single file bundling the 16/32/48px sizes, for browsers that still request the legacy .ico path.
- site.webmanifest — the JSON file that tells Android/Chrome which icons and colors to use for a PWA install, with editable placeholder fields.
If your source image isn't square, it's centered on a transparent square canvas at each size rather than stretched or cropped, so shapes and logos keep their proportions.
Once generated, a ready-to-copy HTML snippet appears below the preview grid with the exact<link rel="icon">,<link rel="apple-touch-icon">, and<link rel="manifest"> tags, already pointing at the filenames in the zip — paste it straight into your site's <head>.
FAQ
What sizes are actually in the zip?
Do I need to edit the manifest before using it?
Will this work for a photo, or only a logo?
Does a PNG or SVG source give a better result?
Is my image uploaded anywhere?
How do I actually wire these files into my site?
Related tools: Resize Image, Crop Image, SVG to PNG.
Advertisement
Ads help keep Kit-Bin free.