Free favicon generator

Import your logo as PNG, SVG or JPG: the tool creates favicon.ico (16, 32 and 48 px), 180, 192 and 512 px PNG icons, site.webmanifest and the HTML tags to copy, in one ZIP. Everything runs in your browser: the image is never sent to a server, with no account and no usage limit.

  • ✓ 100% in your browser
  • ✓ Nothing uploaded
  • ✓ No account, no quota

Create a favicon in 4 steps

  1. 1

    Import the image

    Drop your logo or symbol as PNG, SVG or JPG. A square file of 512 px or more, or an SVG, gives the sharpest icons.

  2. 2

    Adjust the rendering

    Choose a transparent or coloured background, adjust the inner padding and check the preview at 16 and 32 px, the sizes of a browser tab.

  3. 3

    Generate and download

    Click “Generate favicon”, then download the ZIP: favicon.ico, the three PNGs, site.webmanifest and the HTML snippet.

  4. 4

    Install it on your site

    Copy the files to the root of your site and paste the tags in the <head>, or upload the icon in your CMS (see below).

Install the favicon on your site

The method depends on your tool. In every case, clear the cache or open a private window to see the new favicon: browsers keep it in memory for a long time.

HTML site or framework

  1. Copy favicon.ico, apple-touch-icon.png, both android-chrome files and site.webmanifest to the root of the site (next to index.html, or the public/ folder of a framework).
  2. Paste the HTML snippet in the <head> of every page, or of the shared template.
  3. Open https://yoursite/favicon.ico: the file should display without error.

WordPress

  1. Classic theme: Appearance → Customize → Site Identity → Site Icon.
  2. Block theme: in the site editor, the Site Logo block offers to use the image as the site icon.
  3. Upload android-chrome-512x512.png: WordPress asks for a square image of at least 512 px and creates the other sizes itself.

Shopify

  1. Online Store → Themes → Customize.
  2. Open the theme settings: the favicon is in the Logo or Favicon section, depending on the theme.
  3. Upload android-chrome-192x192.png or the 512 px PNG, then save.

Wix

  1. In the dashboard, open Settings, then Favicon.
  2. Upload android-chrome-512x512.png and publish the site.
  3. Wix only allows a custom favicon on sites with a Premium plan and a connected domain.

Favicon sizes and formats

One file is no longer enough: each surface reads a different size. The generated pack covers the common uses.

FileSizeUse
favicon.ico16, 32 and 48 pxTabs, bookmarks, Windows taskbar, search results
apple-touch-icon.png180 × 180 pxiPhone and iPad home screen
android-chrome-192x192.png192 × 192 pxAndroid home screen, manifest
android-chrome-512x512.png512 × 512 pxSplash screen, installing as an app
site.webmanifestJSONName, colours and icons of the web app

Google recommends a square icon larger than 48 × 48 px that crawlers can access: the snippet therefore also declares the 192 px PNG.

Common mistakes

  • Using the full logo with its text: at 16 px the letters turn into a smudge. Use the symbol or an initial.
  • Starting from a small image: a 64 px PNG enlarged to 512 px will be blurry. Prefer an SVG or a PNG of at least 512 px.
  • Forgetting contrast: a dark icon disappears on a dark-mode tab. Test both, or add a background.
  • Putting the files in a subfolder without changing the paths: the snippet tags point to the site root.
  • Blocking the favicon for crawlers: a robots.txt that disallows /favicon.ico prevents Google from showing it in results.
  • Concluding too fast that it does not work: browser and Google caches take time to update.

Frequently asked questions

Is the favicon generator really free?
Yes. There is no account, no quota and no watermark: the conversion runs in your browser, with its own resources.
Is my image uploaded to a server?
No. The file is read and converted locally by your browser, then the ZIP is created on your device. No image leaves your computer.
What size should the source image be?
Ideally a square of at least 512 × 512 px, or an SVG. A rectangular image is centred in the square, with the padding you choose.
Do I still need a favicon.ico file?
Yes, it is the most widely recognised format: browsers, bookmarks, Windows and many tools look for it at the site root. The PNGs complement it for mobile devices.
Why does my favicon not appear in Google?
Google first has to crawl the page and the icon. Check that the file is accessible, square and larger than 48 px, then be patient: the update can take days or weeks.
I do not have a logo yet. What should I do?
Create the logo first, then come back here with its symbol. BrandMotion Lab lets you generate and compare logo proposals, free to start.

No logo yet?

Create it with BrandMotion Lab: describe your business, compare proposals, then come back here to turn it into a favicon.

Create my logo

To understand the formats and design of a good favicon, read our guide too: Favicon: creating your website icon

Sources