Favicon Maker
Upload an image (ideally square) and generate a full favicon icon set for your website, ready to download.
Click to choose an image, or drag and drop it here
Preview:
Includes: favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180x180), android-chrome-192x192.png, android-chrome-512x512.png
What a favicon actually is
A favicon is the small icon that appears in a browser tab, bookmark list, and browser history next to a website's title. While it might seem like a minor visual detail, a missing or broken favicon can make a website feel unfinished or untrustworthy, especially when a visitor has multiple tabs open and relies on favicons to quickly identify which tab belongs to which site.
Modern websites actually need several different icon sizes, not just one โ different platforms and use cases each expect their own dimensions. A basic browser tab typically uses a small 16x16 or 32x32 pixel icon, while a phone's home screen icon (when a site is saved or "added to home screen") needs a much larger, more detailed image, often 180x180 pixels or larger for Apple devices and 192x192 or 512x512 for Android.
Why one image needs multiple sizes
Simply providing one large image and letting each platform scale it down often produces poor results, since fine details that look fine at a large size can become an illegible blur when shrunk to 16x16 pixels. Generating dedicated versions at each required size, with the resizing done deliberately rather than left to browser guesswork, produces sharper, more legible icons across every context they'll be used in.
What this tool does with your image
This tool resizes your uploaded image into the standard set of icon sizes browsers, phones, and bookmark bars expect, using your browser's built-in Canvas API. Everything happens locally on your device โ nothing is uploaded to a server โ and the resulting icon set is bundled into a downloadable zip file so you can add all the required sizes to your website at once.
What image should I upload?
A square image at least 512x512 pixels works best - simple logos or icons scale down more clearly than detailed photos, since fine detail tends to disappear at the smallest icon sizes.
How do I use the downloaded files?
Upload the files to your website's root folder and reference them in your HTML's <head> section with standard favicon link tags for each size, so browsers and devices can find the correct icon for their context.
Why isn't my image square?
If your uploaded image isn't already square, this tool crops it to a square from the center before resizing, which means content near the edges of a non-square image may be cropped out of the final icon set.
Do I need every size this tool generates?
For a basic website, the 16x16 and 32x32 sizes cover standard browser tab display, while the larger sizes matter specifically if you want your site to display a proper icon when someone saves it to their phone's home screen.