Favicon Generator from Image
Generate favicons at 16px through 512px from a single logo, including the 180px Apple touch icon, packaged as a ZIP with a ready-to-paste HTML snippet and web manifest.
A square PNG or SVG of at least 512×512 gives the best result.
A favicon is the small icon in a browser tab, a bookmark list, and a phone home screen — and modern platforms request it at a surprising number of sizes. Rather than exporting each one by hand, this generator renders your logo at every size browsers actually ask for and packages them as a ZIP with a ready-to-paste HTML snippet. Everything is drawn on a canvas in your browser.
How to generate a favicon
- Upload a square logo. At least 512×512 gives the best result at every output size.
- Choose a background — transparent for PNG-style logos, or a solid colour if your mark needs one behind it.
- Review the previews. Pay particular attention to 16px, which is what most people actually see.
- Download the ZIP and drop the files at the root of your site, then paste the snippet from README.txt into your <head>.
The Favicon Generator from Image runs entirely in your browser — nothing you enter is uploaded, stored, or logged.
When to use this tool
Launching a new site
A missing favicon leaves a blank page icon in the tab, which reads as unfinished. It is a five-minute job that noticeably affects how polished a site feels.
Supporting phone home screens
The 180px Apple touch icon is what appears when someone adds your site to an iPhone home screen. Without it, iOS renders a screenshot of the page instead.
Refreshing icons after a rebrand
New logo, new icon set. Regenerating every size from the new mark takes seconds and keeps the sizes consistent.
Things worth knowing
- Simple, high-contrast marks survive being shown at 16 pixels. Detailed logos with fine text turn to mush — consider a simplified variant for the icon.
- Non-square sources are fitted inside the square and centred rather than stretched, so a wide logo leaves space at top and bottom.
- Transparent backgrounds adapt to light and dark browser themes; a solid background will not.
- Browsers cache favicons aggressively. A hard refresh, or a fresh profile, is often needed to see a change.
Frequently Asked Questions
What source image works best?
Which favicon sizes do I actually need?
Do I need an .ico file?
Why does my logo look unreadable at 16px?
How do I install the favicons?
Is my logo uploaded anywhere?
Related Tools
Image Resizer by Pixels & Percent
Resize any image to exact pixel dimensions or a percentage, with aspect ratio locking.
PNG to JPG Converter
Convert PNG images to JPG with custom background fill for transparent areas and adjustable compression quality.
Crop Image & Aspect Ratio Tool
Crop photos to custom dimensions or standard aspect ratios (1:1, 16:9, 4:3, 9:16 Story) with live preview.