This tool needs JavaScript. Everything it does runs in your browser and nothing is sent to a server, so with JavaScript switched off it cannot calculate, generate or draw anything.

Favicon & App Icon Generator

One picture in, every icon a site needs out: the multi size favicon.ico, the PNG sizes, the Apple touch icon, maskable Android icons, a site.webmanifest and the HTML to paste into your head. Square and at least 512 pixels works best.

Drop a picture here, paste, or click to choose SVG, PNG, WebP, AVIF or JPEG. An SVG is passed through untouched as well, which is what modern browsers prefer.

Browser tab

Your site Another tab

iOS home screen

Your site

Android, maskable

Your site

Source —

Paste this into your <head>

site.webmanifest

Name

Full name Short name, for the home screen Path the icons will sit at

Background

iOS fills transparency with black, so the Apple icon always gets this colour, white if you keep transparency.

Padding 0%

Breathing room around the artwork on every icon.

Safe area, maskable 20%

Android crops a maskable icon to whatever shape the launcher uses, which can eat the outer fifth. This shrinks the artwork so nothing important is cut off.

Theme colour

Tints the browser bar on Android and the title bar of an installed app.

The ICO is written here byte by byte: an icon directory holding 16, 32 and 48 pixel PNGs, which every browser still in use understands. An SVG you drop in is copied into the ZIP untouched as well, because a vector favicon stays sharp at any size and is the one modern browsers reach for first. The sizes are the ones that are actually used: 96 for the desktop tab on a high density screen, 180 for iOS, 192 and 512 for Android and for an installed app, and maskable copies of the last two for launchers that crop.