🔍 /

Smart Icon Generator & Converter - Favicon, PWA, Apple Touch Icons

Generate favicons, Apple Touch Icons, Android & PWA icons from any image. Crop, resize, add padding & border radius. Download as ZIP with ICO files.

User Rating 0.0 ★★★★★
Total Usage 0 times
Category Graphic Generators

Drop your image here or click to browse

PNG, JPG, SVG, WebP — min 64×64 px recommended

Is this tool helpful?

Your feedback helps us improve.

★ ★ ★ ★ ★

About

Deploying a web application without a complete icon set causes broken favicons, blank home screen tiles, and degraded search appearance. Browsers request 15+ icon variants across formats: .ico multi-resolution files for legacy browsers, 180×180 px Apple Touch Icons, Android adaptive icons from 48 to 512 px, and Microsoft tile images at 270×270 px. This tool processes your source image entirely in the browser using the Canvas API with multi-step bicubic-quality downscaling. It constructs binary .ico files (ICONDIR + embedded PNG payloads) and packages everything into a valid PKZIP archive. No server upload occurs. Limitation: SVG-to-raster conversion depends on the browser's SVG renderer, so complex filters or external references may not render.

favicon generator icon converter pwa icons apple touch icon ico generator icon resizer manifest icons

Formulas

Icon generation follows a multi-step downscaling algorithm for maximum quality. For a source image of dimensions Wsrc × Hsrc, the effective draw region accounts for padding fraction p:

Wdraw = Starget × (1 − 2p)

Where Starget is the target icon dimension in pixels, and p is the padding ratio (0 to 0.5). The image is centered within the canvas. Multi-step downscaling halves the canvas dimensions iteratively until the next halving would undershoot the target:

n = floor(log2(WsrcWdraw))

Each step draws the image at half its previous size, producing smoother interpolation than a single large-to-small draw. The ICO file format uses a binary header: 6-byte ICONDIR (2 bytes reserved, 2 bytes type = 1, 2 bytes image count), followed by 16-byte ICONDIRENTRY records per embedded image, then raw PNG payloads concatenated sequentially.

Where: Wsrc = source width, Hsrc = source height, Starget = target icon size, p = padding ratio, n = number of halving steps.

Reference Data

Icon NameSize (px)FormatPlatformUsage
favicon-16x1616×16PNGAll BrowsersBrowser tab icon
favicon-32x3232×32PNGAll BrowsersBrowser tab icon (HiDPI)
favicon.ico16, 32, 48ICOIE / LegacyMulti-resolution favicon
apple-touch-icon180×180PNGiOS SafariHome screen bookmark
apple-touch-icon-7676×76PNGiPad (non-Retina)Home screen icon
apple-touch-icon-120120×120PNGiPhone RetinaHome screen icon
apple-touch-icon-152152×152PNGiPad RetinaHome screen icon
android-chrome-192192×192PNGAndroid ChromePWA manifest icon
android-chrome-512512×512PNGAndroid ChromePWA splash screen
android-chrome-4848×48PNGAndroidNotification icon
android-chrome-7272×72PNGAndroid (older)Home screen icon
android-chrome-9696×96PNGAndroidHome screen icon
android-chrome-144144×144PNGAndroidHome screen icon
android-chrome-256256×256PNGAndroidHigh-res adaptive icon
android-chrome-384384×384PNGAndroidHigh-res adaptive icon
mstile-70x7070×70PNGWindowsSmall tile
mstile-150x150150×150PNGWindowsMedium tile
mstile-270x270270×270PNGWindowsLarge tile
mstile-310x150310×150PNGWindowsWide tile
safari-pinned-tab512×512PNGmacOS SafariPinned tab (monochrome SVG ideal)
og-image1200×630PNGSocial MediaOpen Graph preview image

Frequently Asked Questions

Use a source image of at least 1024×1024 pixels. The largest output icon is 512×512 for PWA splash screens, and downscaling from a 2× source (1024 px) yields the sharpest results via multi-step bicubic interpolation. Images below 256 px will produce visibly blurry icons at larger target sizes.
An ICO file uses the ICONDIR binary format (Microsoft specification) containing multiple resolution variants in a single file. The tool embeds 16×16, 32×32, and 48×48 PNG payloads inside the ICO container with proper ICONDIRENTRY headers. A renamed PNG will work in modern Chrome but fail in Internet Explorer and some older Windows applications.
The border radius is applied proportionally. A 20% radius on a 512×512 icon produces a 102.4 px corner radius, while the same 20% on a 16×16 icon produces a 3.2 px radius. This ensures visual consistency across sizes. Note that iOS automatically applies its own superellipse mask to Apple Touch Icons regardless of your setting.
Canvas 2D context uses bilinear interpolation by default. When downscaling by a large factor (e.g., 1024→16), bilinear filtering produces aliasing artifacts. Halving iteratively (1024→512→256→128→64→32→16) forces multiple passes of bilinear filtering, which approximates bicubic quality. This matches the technique used by professional image editors.
Yes. The browser's SVG renderer rasterizes the SVG onto a canvas at the source resolution you specify. However, SVGs using external font references, linked images, or complex CSS filters may not render correctly because the Canvas security model restricts cross-origin resources. For best results, convert text to paths and embed all assets in the SVG.
The ZIP contains all selected icon PNGs in their respective filenames, a favicon.ico with embedded multi-resolution images, a site.webmanifest file with the PWA icon references, a browserconfig.xml for Microsoft tile configuration, and an HTML snippet file showing the link tags to paste into your document head. The ZIP uses the PKZIP format constructed via binary ArrayBuffers - no server or library involved.