favicon.run Logo

Using the Favicon Generator

Turn any image into a complete favicon set — favicon.ico, PNGs, apple-touch-icon, and webmanifest

1 min read

The Favicon Generator transforms any image into a complete set of favicon files — favicon.ico, apple-touch-icon, and PNG favicons in every size you need for modern browsers, PWAs, iOS, and Android.

How to use the Favicon Generator

  • Go to the Favicon Generator page
  • Upload an image by dragging and dropping or clicking the upload area
  • For best results, use a square image of at least 512x512 pixels
  • Review the preview of how your favicon will look in different contexts
  • Click 'Generate Favicons' to produce every favicon size
  • Download the complete package of favicon files
  • Follow the implementation instructions provided to add the icons to your website

Drag and drop image here or click to upload

PNG, JPG and SVG formats supported

favicon.ico
16x16
32x32
192x192

Generated Files and Their Purpose

  • favicon.ico - Traditional browser tab and bookmark icon
  • favicon-16x16.png - Browser tab icon
  • favicon-32x32.png - Higher resolution tabs and Windows taskbar
  • favicon-48x48.png - Windows desktop icon
  • favicon-192x192.png - Android app icon and PWA
  • favicon-512x512.png - PWA app icon
  • apple-touch-icon.png - iOS devices when added to home screen
  • site.webmanifest - Configuration file for PWA support

The tool provides detailed implementation instructions, including the HTML code you need to add to your website's '<head>' section to properly use all generated favicon files.

Add this to the '<head>' of every page

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

site.webmanifest

{
  "name": "My Site",
  "short_name": "My Site",
  "icons": [
    { "src": "/favicon-192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/favicon-512.png", "sizes": "512x512", "type": "image/png" }
  ],
  "theme_color": "#ffffff",
  "background_color": "#ffffff",
  "display": "standalone"
}

Frequently Asked Questions

What image should I upload for the best result?+

Use a square PNG or SVG at least 512x512 pixels. A simple, high-contrast logo works best — tiny favicons lose detail, so avoid thin lines and small text.

What files are inside the generated ZIP?+

favicon.ico, favicon-16x16.png, favicon-32x32.png, favicon-48x48.png, favicon-192x192.png, favicon-512x512.png, apple-touch-icon.png, and site.webmanifest — everything modern browsers, iOS, Android, and PWAs expect.

Do I still need favicon.ico in 2026?+

Yes. Older browsers and some tools still request /favicon.ico directly, and it serves as the universal fallback. The generator includes it alongside the modern PNG/SVG set.

Ready to put it into practice?

Fetch any favicon

Enter a URL and get every favicon the site exposes, plus one-line embed code.

Open tool

Generate from image

Upload a logo and download favicon.ico, apple-touch-icon, and PNG icons in one ZIP.

Open tool

From text or emoji

Type a letter or pick an emoji, choose colors, and generate a full favicon package.

Open tool

Check a site's favicon

Test whether a website's favicon, apple-touch-icon, and manifest are correctly set up.

Open tool
← Back to Guides