How the image to favicon converter works

When you drop an image into the image to favicon converter, it never leaves your computer. Every step below runs in your browser.

1. Reading the image

The browser opens your file with the same image decoder it uses for web pages, so PNG, JPG, WebP and SVG all work. Transparent areas stay transparent.

2. Making it square

Favicons are square, but logos often aren't. You choose how to handle that:

• Whole image keeps the full logo and adds empty space on the short sides.
• Fill and crop fills the square and trims the edges.

You can also add padding, round the corners or turn it into a circle, and put it on a solid background.

3. Shrinking without jagged edges

Shrinking a large logo straight down to 16 pixels throws away most of its detail and leaves rough edges. Instead, the converter halves the image again and again (1024, 512, 256…) until it reaches the size it needs. Each step blends neighbouring pixels, which keeps edges smooth.

4. Building favicon.ico

An .ico file is a small container that holds several images. The converter places the 16, 32 and 48 pixel versions inside one favicon.ico, so each browser picks the size that suits it.

5. The zip file

The download contains:

File	Where it is used
favicon.ico	Browser tabs, bookmarks, older browsers
favicon-16x16.png, favicon-32x32.png	Browser tabs in modern browsers
apple-touch-icon.png	iPhone and iPad home screen
android-chrome-192x192.png, android-chrome-512x512.png	Android home screen and installed web apps
site.webmanifest	Tells Android which icons and colours to use
head-snippet.html	The code to paste into your page

The Apple touch icon always gets a solid background, because iOS shows transparent areas as black.