Favicon Generator
Turn a logo into every icon you need — favicons, a full iOS AppIcon set and Android launcher and Play Store icons, in one zip. Nothing is uploaded.
Table of contents
How to make a favicon
- 1
Drop in your logo
PNG, JPEG, SVG or WebP. Square works best, but anything is fitted and centred rather than squashed — a stretched logo is unreadable at the size where legibility is the only thing that matters.
- 2
Add padding or a background if it needs one
A dense logo reads better at 16 pixels with a little breathing room. A background matters if your logo is transparent, because iOS draws home-screen icons on black.
- 3
Tick iOS or Android if you need app icons
You get a complete AppIcon.appiconset with its Contents.json, and every Android launcher density plus the adaptive layers and the Play Store icon.
- 4
Download the pack
One zip, sorted into web, ios and android folders. Unzip the web folder into the root of your site and drop the others into your project.
- 5
Paste the markup
Five lines into your <head>. The favicon.ico line matters even though browsers request that file anyway — declaring it is the difference between a hit and a 404 on every first visit.
Six files, not thirty
Favicon generators have a habit of producing an enormous folder: Windows tile images in four sizes, a dozen iOS icons from before iOS learned to scale them itself, Android densities that the manifest replaced years ago, and a browserconfig.xml for a browser nobody runs. It looks thorough. Almost none of it is ever requested.
Four slots cover essentially everything today. Desktop browsers take favicon.ico or the 32-pixel PNG. iOS takes the 180-pixel apple-touch-icon. Android's install prompt reads 192 and 512 from the web manifest. That is the list, and everything here exists to fill one of those slots.
The one piece of apparent legacy worth keeping is favicon.ico itself — not for old browsers, but because every browser still requests that path unprompted. Shipping it turns a guaranteed 404 into a cached kilobyte.
Designing for sixteen pixels
A favicon is mostly seen at 16 pixels square, in a row of other tabs, at a glance. That is roughly the resolution of a single letter of body text — which is why logos with a wordmark, fine strokes or three colours reliably become an indistinct smudge no matter how the resampling is done.
What survives is a single shape with strong contrast. One letter, one symbol, one silhouette. If your full logo has a mark and a wordmark, use just the mark. If it has thin lines, thicken them. A little padding helps too, because tabs crop tightly and a shape that touches the edges reads as a rectangle.
This tool fits your image rather than stretching it, so a wide logo keeps its proportions and gets letterboxed instead of squashed. That prevents the worst outcome, but it cannot make a detailed logo legible — for that, simplify the source and try again at 16 pixels until you can recognise it.
Frequently asked questions
Yes, and for a slightly annoying reason: browsers request /favicon.ico whether or not you declare it. If the file is not there, every first visit generates a 404 in your logs. It is also still what several tools, feed readers and older browsers look for first. It costs about a kilobyte, so it is not worth the argument.
Because Apple refuses any App Store icon whose PNG carries an alpha channel — error ITMS-90717 — and a canvas always writes one, even when every pixel is fully opaque. Filling in a background is not enough: the channel still exists for the validator to object to. This tool re-encodes the 1024 icon as a true RGB PNG with no alpha channel at all, which is the only thing that actually satisfies it.
A complete AppIcon.appiconset: every size Xcode asks for from 20 up to the 1024 App Store icon, plus the Contents.json that tells Xcode which file fills which slot. Drop the folder into your asset catalog and it is done. Every icon is opaque, because iOS does not honour transparency and composites it onto black.
All five launcher densities from mdpi to xxxhdpi, the 512-pixel Play Store listing icon, and the two adaptive icon layers with the XML that references them. Your logo is inset into the safe zone on the foreground layer, because Android composes adaptive icons at 108dp and only guarantees the middle 72dp survives the launcher's mask.
Android lets each launcher crop icons to its own shape — a circle, a squircle, a rounded square — and animates them with a parallax effect. To make that possible it only promises that the central 66% of the image is visible; anything outside can be cropped. So the foreground layer insets your logo to fit inside that band. It looks smaller in the file and correct on the device.
Because most of those thirty are for platforms that no longer exist. Windows tile images, a dozen iOS sizes from the era before iOS scaled icons itself, and the various Android densities are all legacy on the web. Modern browsers take the ICO or the 32px PNG, iOS takes the 180px apple-touch-icon, and Android reads 192 and 512 from the manifest. The app icon sets are separate, and you only get them if you ask.
Three PNG images, at 16, 32 and 48 pixels. ICO is a container that can hold several sizes so the browser picks the right one, and it has accepted PNG-compressed entries for many years — which is far more sensible than the original format of upside-down bitmaps with their own colour tables.
Usually a little for the web icons. A logo designed to be seen at 200 pixels often has fine detail and tight margins that turn to mush at 16. Ten to fifteen percent, and simplifying the mark itself if you can, does more for legibility than any amount of resampling. The adaptive and maskable icons get their own inset automatically, so you do not need to double up.
Because the source is transparent. iOS does not preserve transparency in home-screen icons — it composites them onto black. Tick the background option and pick a colour that suits your logo. The iOS set always gets a background for this reason, defaulting to white if you have not chosen one.
Yes, as the source, and it is the best thing to start from — your browser rasterises it fresh at every size, which beats upscaling a small PNG. The output is always PNG and ICO, because that is what the icon slots accept.
No. Every size is drawn by a canvas in your browser and packaged into a zip there too. Nothing is sent anywhere, which for an unreleased app icon is a meaningful difference from the usual arrangement.
The Zeal Promise
Non-negotiable, on every tool we ship.
- No sign-up — ever
- No watermarks on any output
- No ads near the download button
- Works fully on mobile
- Privacy-first: processing stays in your browser
- Open source (MIT) — audit it, contribute, self-host
- Zero runtime dependencies in tool logic