β˜…

Favicon Generator icon

Produce the full set of favicon sizes from one image, along with the HTML snippet.

file background
OUTPUTfavicon sizes
β€”
Select an image
OUTPUThtml snippet
0 lines 0 chars
1
generated with canvas in the browser Β· never uploaded
Tool Guide

What this tool does

A favicon is the small icon shown in browser tabs and bookmarks. The complication is that one size is not enough: tabs use 16 or 32 pixels, iOS home screens use 180, Android uses 192, and a PWA splash screen wants 512.

Supply one image and this tool renders all of those at once. The source is scaled to fit inside a square while preserving its aspect ratio and centred, with the background left transparent or filled white or dark. Each size can be downloaded individually or all together, and the link tags for the head element are provided alongside.

A non-square source leaves padding on two sides, so a notice appears when the aspect ratio is far from square. Preparing a square crop of the logo gives noticeably better results than using the full wordmark.

When to use it

Use it when launching a site, when replacing a logo and regenerating the icon set, when assembling icons for a PWA manifest, or when fixing a blurry icon after adding a site to a mobile home screen.

Input and output examples

Input A 512Γ—512 logo
Output Nine PNGs at 16, 32, 48, 64, 96, 128, 180, 192, and 512

Download individually or all at once.

Input A wide image
Output Centred inside a square with padding, plus a notice

A square crop produces a better result.

Notes and limitations

Fine detail disappears at small sizes. At 16 pixels, text and thin strokes are essentially invisible, so a simplified symbol reads far better than a full logo. Output is PNG; the legacy .ico format is not produced, which is fine for current browsers. Browsers also cache favicons aggressively, so a replacement may not appear immediately: force a reload or add a version to the filename. Downloading all sizes happens sequentially because browsers block rapid consecutive downloads.

Frequently asked questions

Do you generate an .ico file?

No. Output is PNG, which every current browser supports for favicons.

I replaced the favicon but the old one persists.

Browsers cache favicons for a long time. Force a reload or add a version string to the filename.

Which sizes do I actually need?

At minimum 32 for tabs, 180 for iOS home screens, and 192 with 512 for Android and PWA covers nearly everything.

Copied