Favicon Generator
Upload an image and generate all favicon sizes plus the HTML tags to add to your site.
How to Use
- Upload a square image — ideally 512×512px or larger.
- Preview each generated size to check clarity at small dimensions.
- Download the favicon files individually or all at once.
- Copy the HTML tags into your page's <head> section.
When to Use This
- Setting up icons for a new site in a single pass, rather than exporting five separate sizes by hand from a design tool.
- Replacing an aging 16-pixel icon on an older site that predates home-screen icons and never gained the larger sizes.
- Checking whether a logo survives being scaled down to 16 pixels, before committing to it as the site mark.
- Regenerating every size after a rebrand, so the tab icon and the home-screen icon do not drift out of sync.
Frequently Asked Questions
About This Tool
One favicon file stopped being enough once phones began putting site icons on a home screen. Browsers want 16 and 32 pixel icons for the tab and the bookmark bar, iOS asks for a 180 pixel apple-touch-icon, and Android and installable web apps look for 192 and 512 pixel versions. The design consequence matters more than the file count: a mark that reads well at 512 pixels usually has to lose detail before it reads at 16.
Your file is loaded into an image element from an object URL and is never uploaded. The shorter side determines a centered square crop, which is drawn into five canvases at 16, 32, 180, 192 and 512 pixels and exported as PNG through toDataURL. Each size appears with its own download link, a download-all button fires them one after another, and the five matching link tags are written out for the document head.
Notes & Limits
- PNG is the only output format. No .ico file is produced, so a browser that looks only for /favicon.ico needs one made elsewhere.
- Files download one at a time, roughly a third of a second apart, rather than as a zip, so a browser set to ask where to save prompts five times.
- No web app manifest is written, and the 192 and 512 pixel icons do nothing for an installable app until something references them from one.
- A non-square image is cropped to its center rather than padded, so a wide wordmark loses both ends. Crop to a square yourself first.