All Tools

Favicon Generator

Create a complete favicon set from letters, an emoji or an image: favicon.ico, the PNG sizes for iPhone and Android, a web app manifest and the tags to paste into your page. Everything is drawn in your browser, so your logo is never uploaded.

  • PrivateYour files never leave this device
  • No uploadsProcessed in your browser, not on a server
  • 100% freeNo signup, no watermark, no trial
  • UnlimitedUse it as often as you like, no daily caps

How we protect your privacy →

1. Make the icon from

2. Background and shape

12%

3. Site details (for the manifest and tags)

Under the icon on phones (12 characters).
Leave empty for the site root (recommended).

Preview

Drawing…

HTML for your <head>

<link rel="icon" href="/favicon.ico" sizes="48x48">
<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">
<meta name="theme-color" content="#1e6bff">

site.webmanifest

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

How to use the Favicon Generator

  1. Choose what the icon is made from: letters, an emoji or your own image.
  2. Pick the background colour (or transparent), the shape and the padding, and watch the preview at every size.
  3. Fill in your site name and colours for the manifest.
  4. Click Download ZIP, upload the files to your site's root folder and paste the HTML tags into <head>.

Frequently asked questions

What sizes does a favicon need in 2026?

A favicon.ico with 16, 32 and 48 px for browsers and Windows, a 180 × 180 apple-touch-icon.png for iPhone and iPad, and 192 and 512 px PNGs in a web manifest for Android and installed web apps. This tool makes all of them.

Where do I put the favicon files?

Upload them to the root folder of your website, so favicon.ico opens at yoursite.com/favicon.ico, then paste the HTML tags inside <head> on every page. If you use another folder, enter it under Site details and the tags and manifest follow it.

Why isn't my new favicon showing?

Browsers cache favicons hard. Open the favicon address directly, hard-refresh with Ctrl+F5, or try a private window. Google search results can take days or weeks to pick up a new icon.

Can the favicon have a transparent background?

Yes for the browser tab icons and the Android PNGs. The iPhone icon can't be transparent (iOS fills it with black), so it gets the background colour you set in Site details.

What image works best?

A simple, square logo of at least 512 × 512 px, ideally a PNG with a transparent background or an SVG. Fine detail disappears at 16 px, so a bold mark or one letter reads better than a full logo with text.

Is my logo uploaded?

No. The icons are drawn on a canvas in your browser and the ZIP is built on your device.