Favicon Generator

Create favicons for websites in all required sizes and formats. Generate ICO, PNG, and Apple Touch icons from a single image.

100% client-side No signup Free forever

Drag & drop an image here or browse

Recommended: Square image, min 512×512px
// how to use

How to Use Favicon Generator

How to Generate Favicons

  1. Upload your image: Select a square image, ideally 512×512px or larger. PNG with transparency works best.
  2. Preview all sizes: See how your favicon looks at each required size.
  3. Customize if needed: Adjust background color for transparent areas.
  4. Generate all formats: Create ICO, PNG, and Apple Touch icons.
  5. Download package: Get a ZIP with all files and implementation code.
  6. Implement: Copy the provided HTML to your <head> section.

Implementation Code

<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
// features

Features

  • Generate all required favicon sizes
  • ICO file with multiple sizes
  • PNG favicons for modern browsers
  • Apple Touch Icon (180×180)
  • Android Chrome icons (192×192, 512×512)
  • MS Tile icons for Windows
  • Transparent background support
  • Preview at all sizes
  • HTML code for implementation
  • Download all files as ZIP
  • Upload any image format
  • Free with no registration
// about

About Favicon Generator

Favicons are the small icons that appear in browser tabs, bookmarks, and mobile home screens. Modern browsers and devices require multiple sizes and formats—our generator creates all variants from a single source image.

Generated Favicon Formats

Complete favicon package includes:

  • ICO file: Classic favicon.ico with multiple sizes (16x16, 32x32, 48x48)
  • PNG variants: 192x192 and 512x512 for Android and PWA manifests
  • Apple Touch Icon: 180x180 for iOS home screen bookmarks
  • Microsoft Tile: 150x150 for Windows pinned sites

Source Image Requirements

Start with a square image, ideally 512x512 pixels or larger. The generator creates smaller sizes by scaling down—starting with high resolution ensures sharp icons at all sizes. Simple, recognizable designs work best at small favicon sizes where detail is lost.

Implementation

After generating, place favicon.ico in your site root. Add additional sizes via link tags in your HTML head. Modern sites should include manifest.json for PWA support, referencing the larger PNG icons for app-like installations.

Testing Your Favicons

Check favicons across browsers (Chrome, Firefox, Safari, Edge) and devices. Verify appearance on both light and dark browser themes. Test mobile home screen appearance on iOS and Android. Clear browser cache if old favicons persist.

// faq

Frequently Asked Questions

What is a favicon and why do I need one?
A favicon is the small icon in browser tabs, bookmarks, and mobile home screens. It brands your site and helps users identify your pages among many tabs. Without one, browsers show a generic icon or blank. Every website should have a favicon.
What sizes do I need for favicons?
Modern favicon requirements: 16×16 (tab icon), 32×32 (taskbar), 48×48 (Windows), 180×180 (Apple Touch), 192×192 and 512×512 (Android/PWA). Our generator creates all sizes from one upload, plus the manifest.json for PWA support.
What file format should favicons be?
ICO format supports multiple sizes in one file (traditional). PNG is used for modern Apple and Android icons. SVG enables scalable favicons in modern browsers. Our generator outputs all necessary formats. For maximum compatibility, include both ICO and PNG versions.
How do I add a favicon to my website?
Add link tags in your HTML <head>: <link rel="icon" href="/favicon.ico"> for basic browsers, <link rel="apple-touch-icon" href="/apple-touch-icon.png"> for iOS, and manifest.json for Android PWA. Our tool generates the complete HTML code to paste.
Why isn't my favicon showing up?
Common issues: browser cache (try hard refresh or incognito), wrong path in HTML (use absolute paths), missing file on server, or incorrect format. Also check for HTTPS mixed content issues. Our tester validates your favicon implementation.
Can I create an animated favicon?
Modern browsers support animated favicons (GIF for basic, or JavaScript for dynamic effects). However, animated favicons can be distracting and some browsers limit or ignore them. Use sparingly - for notifications or loading states at most.