Updated June 2026 · ConvertCabin Guides
How to Make a Favicon
A favicon is the small icon shown in a browser tab, bookmark and history. Making one well means bundling a few sizes into a single .ico so it stays sharp everywhere.
What you need
Start with a square image — a logo or simple mark works best, since favicons are tiny. Busy photos rarely read well at 16×16 pixels.
Steps
- Open the Image to ICO tool and drop your square image. It is converted in your browser.
- Keep the default 16, 32 and 48 pixel sizes (a good favicon set), or choose the full range up to 256 for app icons.
- Download the
.icofile.
Adding it to your site
- Place the file in your site’s root as
favicon.ico— most browsers find it automatically. - Or reference it explicitly in your page head:
<link rel="icon" href="/favicon.ico">. - Modern sites often also add a larger PNG for high-resolution displays, but a multi-size .ico covers the essentials.
Why multiple sizes
Different places use different sizes — the tab uses a small icon, bookmarks and the desktop use larger ones. Bundling several sizes in one .ico lets each context pick the crispest version instead of scaling a single image up or down.
Frequently asked questions
What size should a favicon be?
A classic favicon bundles 16, 32 and 48 pixel versions in one .ico. For app and pinned-tab icons you may also want 64, 128 and 256.
Can I use a PNG or JPG as a favicon?
Browsers can use a PNG, but a multi-size .ico is the most reliable across browsers and the OS. If you start from a PNG or JPG, convert it to .ico.
Where do I put the favicon file?
Put favicon.ico in your website’s root folder. Browsers look there by default; you can also link it explicitly in the page head.