100% Free · No Sign-up Required

Favicon Generator

Convert PNG, text, or emoji into a complete favicon package.
Download ICO + all PNG sizes + site.webmanifest in one click.

Drag & drop or browse file
Any image type · Max 5 MB
For best results use a square image with a transparent background.
Aa
Inter
Aa
Roboto
Aa
Poppins
Aa
Playfair Display
AA
Oswald
Aa
Space Grotesk
On Windows: Win + . to open emoji picker
Live Preview
16px
32px
64px
128px
My Website
Generating your favicon package…
How to use

Add your favicon in 3 steps

1

Create

Choose PNG, Text, or Emoji mode. Customize colors, fonts, and shapes until your favicon looks perfect.

2

Download

Click "Download Favicon Package". You'll get a ZIP with ICO, all PNG sizes, and a webmanifest.

3

Install

Drop the files in your website root and paste the HTML snippet from the README into your .

What's in the ZIP

Complete favicon package

Every file your website needs across all browsers, OS, and devices.

favicon.ico
16 · 32 · 48 · 64 · 128 · 256 px
favicon-16x16.png
Browsers
favicon-32x32.png
Taskbar / Retina
favicon-48x48.png
Windows desktop
apple-touch-icon.png
iOS / Safari (180×180)
android-chrome-192x192.png
Android Chrome
android-chrome-512x512.png
Android splash
site.webmanifest
PWA manifest
README.txt
HTML install snippet
HTML snippet (paste in <head>)
<link rel="icon" type="image/x-icon"
      href="/favicon.ico">
<link rel="icon" type="image/png"
      sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png"
      sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon"
      sizes="180x180"
      href="/apple-touch-icon.png">
<link rel="manifest"
      href="/site.webmanifest">

What a Favicon Is, and Why It Is Worth Getting Right

A favicon is the small icon that represents your website — the tiny image in the browser tab, next to a bookmark, in mobile search results, and on a phone’s home screen when someone saves your site. It is easy to overlook because it is small, but it is one of the most visible pieces of your brand: people see it every time they have your site open.

This generator takes a single image and produces every size and format that modern browsers and devices expect — from the classic 16×16 tab icon to large Apple touch icons — bundled in a ready-to-use ZIP. There is no design software to learn and no guessing about which sizes you actually need.

How to Generate a Favicon

1. Upload an image

Start with a square logo or icon. A PNG with a transparent background works best, and a larger source image gives sharper results.

2. We generate every size

The tool creates each required favicon size and format automatically, including ICO, PNG and Apple touch icons.

3. Preview it

See how your icon will look in a real browser tab before you download, so there are no surprises.

4. Download and install

Grab the ZIP, drop the files into your site’s root, and add the provided link tags to your HTML head.

Why Favicons Matter

Instant recognition

When a visitor has a dozen tabs open, a distinctive favicon helps them find yours at a glance. It is a small detail that keeps your brand visible.

It signals professionalism

A missing favicon leaves a generic globe or a blank square, which quietly makes a site feel unfinished. A proper icon shows the details were handled.

It looks right on every device

Add-to-home-screen on iOS and Android uses larger icons. Generating the full set means your site stays crisp whether it is a tab or a home-screen shortcut.

It shows up in mobile search

Google displays favicons next to results on mobile. A clear icon can make your listing stand out on a page full of plain text.

Favicon Tips and Common Mistakes

Starting with a tiny or blurry image

Favicons shrink down a lot, so begin with a large, clean, square source (at least 512×512). Upscaling a small image just produces a fuzzy icon.

Using a detailed full logo

Fine text and intricate details disappear at 16×16. A simplified mark, monogram or symbol reads far better at small sizes than a full wordmark.

Forgetting the Apple touch icon

iOS uses a separate, larger icon for home-screen shortcuts. Skip it and Safari falls back to a screenshot of your page, which rarely looks good.

Not clearing the cache

Browsers cache favicons aggressively. If an update does not appear, do a hard refresh or test in a private window before assuming something is wrong.

Skipping the link tags

Uploading the files to your server is not enough on its own. Add the provided link tags to your HTML head so browsers know where to find each size.

Frequently Asked Questions

There is no single size — modern sites use several. The classic tab icon is 16×16 and 32×32, Apple touch icons are 180×180, and Android uses up to 512×512. This generator creates all of them from one upload.

Upload a high-resolution PNG, ideally with a transparent background. The tool then outputs ICO (for older browsers) and PNG sizes automatically, so every browser gets a format it supports.

Place them in your website’s root folder, then add the provided link tags inside your HTML head. The download includes the exact tags to copy and paste.

Browsers cache favicons for a long time. Try a hard refresh (Ctrl or Cmd + Shift + R), open the site in a private window, or clear your cache — the new icon usually appears after that.

It is not a direct ranking factor, but Google shows favicons next to mobile search results, so a clear icon improves how your listing looks and can lift click-through. It also signals a site that is well maintained.

Yes, as long as it is reasonably square and good quality. Logos, symbols and monograms work best. Very wide or highly detailed images should be simplified first, since they lose clarity at small sizes.