Favicon & App Icon Generator

Web favicon pack, iOS AppIcon.appiconset, Android launcher (mipmap + adaptive), or custom-size zip — from one image.

published updated

  • [FREE]
  • [NO_SIGNUP]
  • [NO_UPLOAD]

A favicon generator turns one source image into the full ICO + PNG + Apple touch icon + web manifest bundle modern browsers need. This tool runs entirely in your browser — no upload, no server roundtrip, ready in seconds.

What gets generated

FileSizePurpose
favicon.ico16+32+48 packedUniversal compatibility, browser tab bar, search results
favicon-16x16.png16×16Modern <link> for browser tabs
favicon-32x32.png32×32Higher-DPI tab bar, bookmark bar
apple-touch-icon.png180×180iOS home screen and PWA launcher
android-chrome-192x192.png192×192Android home screen at standard density
android-chrome-512x512.png512×512Android splash screen, large launcher
maskable-icon-512x512.png512×512Android adaptive icons (with safe-zone padding)
site.webmanifestJSONPWA install metadata
favicon.svgvectorCrisp at any DPI, modern browsers only (only if source is SVG)

Why so many sizes?

Different surfaces have different requirements:

  • Browser tab: 16×16 (and 32×32 on retina). Reads small enough that detailed logos blur into mush.
  • Bookmarks bar: 16×16 on most browsers, 32×32 on retina.
  • iOS home screen: 180×180. Apple does not honor maskable; it crops to its own squircle.
  • Android home screen: 192×192 standard, 512×512 high-density, plus a maskable variant for adaptive icons.
  • PWA splash screen: Android uses the 512×512 icon plus the manifest’s background_color.
  • Search results: Google fetches /favicon.ico if present; bigger sizes inside the ICO get used for richer cards.

A single high-resolution source image, resized properly, covers all of these. The tool uses Lanczos-3 resampling (the same algorithm used by professional image editors) for sharp downscales without the blur you get from default browser resampling.

ICO vs PNG

The .ico format predates PNG. Originally each image inside an ICO was a 32-bit BMP — bulky and limited to 256 colors at small sizes. Since Windows Vista (and IE9), ICO files can contain PNG images directly. This tool uses PNG-in-ICO because:

  • Smaller file size than BMP-in-ICO for icons with alpha
  • Better quality at 16×16 and 32×32
  • Supported by every browser since 2011

The packed ICO is ~5–15KB for a typical favicon. Browsers fetch it once and cache it.

Maskable icons in detail

Android 8+ supports “adaptive icons” — launcher icons that the OS crops into a system-themed shape. Some Samsung devices crop to a squircle, Pixels crop to a circle, others to a rounded square. If your app icon fills the entire 512×512 canvas edge-to-edge, the crop will chop off your logo.

The tool generates a maskable icon by:

  1. Filling the entire 512×512 canvas with your chosen background color.
  2. Drawing your source image centered at 80% of the canvas size (the standard safe-zone ratio defined by the W3C maskable icons spec).
  3. Setting "purpose": "maskable" on the icon entry in site.webmanifest.

Test the result at maskable.app if you want to preview how different launchers will crop it.

The HTML snippet

The tool generates a snippet you paste once into your <head>:

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#1f2937">

rel="icon" sizes="any" (the ICO) is the universal fallback. Modern browsers prefer the typed PNG / SVG variants below. iOS reads apple-touch-icon. Android reads manifest for everything else.

Where to place the files

All files belong at your website root, i.e. requestable as:

  • https://yoursite.com/favicon.ico
  • https://yoursite.com/favicon-16x16.png
  • etc.

Browsers look for /favicon.ico by URL convention even without a <link> tag, so even if you forget to paste the snippet, the basic favicon will still appear in tabs.

Privacy

A static HTML page, a small JavaScript bundle, and three lazy-loaded WebAssembly codecs (jsquash/resize for Lanczos resampling, jsquash/png for PNG encoding, plus fflate for the ZIP) — all running in your browser tab. The Network tab in DevTools confirms it: no requests fire when you drop a file, generate, or download. Your source image stays on your device.

How it compares

bytefork.toolsrealfavicongenerator.netfavicon.io
Runs in browser✗ (uploads source image)partial (text→favicon local; image upload)
Outputs ICO + PNG + manifest
Apple touch icon
Maskable icon support
Sign-in required
Ad-free

iOS app icon preset

The iOS app icon preset outputs a complete AppIcon.appiconset folder ready to drop into Xcode at Assets.xcassets/AppIcon.appiconset. Contents.json is generated automatically so Xcode picks every variant up without manual configuration.

Sizes included (idiom, point size @ scale = pixel size):

  • iPhone: 20@2x (40), 20@3x (60), 29@2x (58), 29@3x (87), 40@2x (80), 40@3x (120), 60@2x (120), 60@3x (180)
  • iPad: 20@1x (20), 20@2x (40), 29@1x (29), 29@2x (58), 40@1x (40), 40@2x (80), 76@1x (76), 76@2x (152), 83.5@2x (167)
  • App Store / marketing: 1024@1x (1024)

For best results, upload a square PNG or SVG at 1024×1024 or larger.

Android launcher preset

The Android launcher preset mirrors the Android Studio res/ directory layout. Drop the folder under app/src/main/res/ and the build picks everything up.

  • Legacy mipmap PNGs in mipmap-mdpi/ (48), mipmap-hdpi/ (72), mipmap-xhdpi/ (96), mipmap-xxhdpi/ (144), mipmap-xxxhdpi/ (192)
  • Round variants for circular launchers in each mipmap-* folder
  • Adaptive icon for Android 8+ (API 26): a 432×432 foreground PNG in drawable/, plus mipmap-anydpi-v26/ic_launcher.xml and values/ic_launcher_background.xml carrying your chosen background color
  • 512×512 Play Store icon at the zip root for store submission

Set the background color input to control the adaptive icon background. The foreground keeps your original artwork.

Custom sizes preset

Pick any combination of common dimensions (16, 32, 48, 64, 96, 128, 192, 256, 384, 512, 1024). The tool ships a zip containing one PNG per checked size, named logo-{N}x{N}.png. Useful when:

  • A platform requires a specific non-standard size
  • Documentation needs the same logo at several display sizes
  • You want pre-sized images for an email-newsletter signature, GitHub README, or social-media avatar

Frequently asked questions

What files does this tool generate?

Eight files covering every modern browser and PWA target: favicon.ico (16/32/48 multi-image), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png, android-chrome-512x512.png, maskable-icon-512x512.png (with safe-zone padding), and site.webmanifest. If you upload an SVG, favicon.svg is included too. Everything zipped as favicon-pack.zip.

Do my images leave my browser?

No. Decode, resize (Lanczos-3 via WebAssembly), PNG re-encode, ICO packing, and ZIP bundling all happen in your browser tab. The Network tab in DevTools confirms it — once the codecs load, no requests fire. Your source image never reaches a server.

What size should my source image be?

At least 512×512 pixels. Square. Tools downscale beautifully but cannot invent detail going up. PNG, JPG, WebP, and SVG are accepted. SVG is preferred because it scales perfectly to every output size and is also included as favicon.svg for modern browsers.

What is a maskable icon?

Android, Samsung, and other Chromium-based home-screen launchers crop launcher icons into platform-specific shapes (circle, squircle, rounded square). A "maskable" icon includes a safe zone of solid background around the visible artwork — roughly the outer 20% — so the crop never removes important detail. The tool generates one automatically: your image centered at 80% of the canvas, filled to the edges with your chosen background color.

Why include a multi-image ICO when modern browsers prefer PNG?

Many corporate intranets and old browsers still request /favicon.ico by URL convention. Search engines display the .ico in result snippets. The tool packs 16×16, 32×32, and 48×48 PNG images inside the ICO container (PNG-in-ICO has been supported in Windows since Vista and in every browser since IE9). One file, three resolutions, maximum compatibility.

How does the web manifest get used?

Modern browsers read site.webmanifest when a user "installs" your site as a Progressive Web App. The manifest tells the OS the app name, icons, theme color (used for the browser chrome on Android), and background color (used for the splash screen when the PWA launches). Even non-PWAs benefit because Chrome on Android uses theme_color to color the address bar.

What should the theme color be?

Pick a color that represents your brand and contrasts well with white text. On Android, this fills the address bar at the top of the browser. On desktop Chrome it has no effect. Defaults to a near-black slate (#1f2937) — change it to match your brand.

How do I install the favicons after downloading?

Extract the ZIP and place every file in your website root (where /favicon.ico would be requested). Then paste the HTML snippet provided into the <head> of every page. The browser does the rest. The snippet links to favicon.ico, the PNG sizes, the apple-touch-icon, the manifest, and sets the theme-color meta.

Is this tool really free?

Yes. No signup, no watermark, no usage limit, no ads. Generate as many favicon sets as you like.

What does the iOS preset produce?

A full AppIcon.appiconset folder ready to drop into Xcode (Assets.xcassets). It includes every required iPhone size (20pt/29pt/40pt/60pt at @2x and @3x), every required iPad size (20pt/29pt/40pt/76pt at @1x and @2x plus 83.5pt @2x), and the 1024×1024 App Store / marketing image. Contents.json is generated alongside the PNGs so Xcode picks them up automatically.

What does the Android preset produce?

A res/ folder mirroring Android Studio layout: legacy mipmap PNGs at mdpi (48), hdpi (72), xhdpi (96), xxhdpi (144), and xxxhdpi (192) plus round variants; an adaptive-icon (Android 8+ / API 26) foreground PNG at 432×432 in drawable/, an ic_launcher.xml in mipmap-anydpi-v26/, and the background color XML; plus the 512×512 Play Store icon at the zip root.

What does the Custom sizes preset produce?

Pick any combination of common logo sizes (16, 32, 48, 64, 96, 128, 192, 256, 384, 512, 1024) and the tool ships a zip with one PNG per size, named logo-{N}x{N}.png. Useful when you need a logo at several specific dimensions for documentation, marketing assets, or one-off platform requirements.