Free tool

Favicon Generator

Generate a complete favicon package, download as ZIP with HTML snippet.

This free favicon generator turns one image into the whole set a site needs: 16 PNG sizes for browsers, Apple devices, Android and Windows tiles, a multi-size favicon.ico, a site.webmanifest and a browserconfig.xml, plus the HTML to paste into your head. Nineteen files, one ZIP, no sign-up.

Your image never leaves your browser. It is read locally, every icon is drawn on a canvas in your own tab, and the ZIP is assembled there too. Nothing is uploaded and nothing is stored.

Your image

Drop an image here, or click to choose

PNG, JPG, SVG or WebP. Square works best, at least 512 by 512.

Options

Site name

Used in site.webmanifest, which is the name shown when someone installs your site to a home screen.

Icon style

Fills the square with your background colour and centres the image inside it.

Corner radius: 0%

Rounds the icon itself. Leave at 0 if you want the platforms to do their own rounding.

Image size: 85%

How much of the square your image fills, leaving the rest as margin.

Background colour

Sits behind your image, and becomes the Windows tile colour.

Theme colour

The browser UI colour on Android, written into the meta tags and the manifest.

Where the files will live

The folder you will upload them to. Leave as / for the site root, or set something like /assets/icons/.

Preview

Choose an image to see how it will look as a tab icon and on a home screen.

Your package

How to make your favicon package

Five steps, and nothing to install.

Drop in your image. PNG, JPG, WebP or SVG. Square works best, and at least 512 by 512, because the largest icon in the set is 512. The tool tells you if yours is smaller.
Choose an icon style. Background and margin fills the square with your colour and insets your image, with an optional corner radius. Use my image as it is draws it with no background and keeps transparency.
Set your colours. The background colour sits behind the image and becomes the Windows tile colour. The theme colour is what Android paints its browser bar.
Say where the files will live. Leave it as / for the site root, or set a folder like /assets/icons/. Every path in the snippet and the manifest follows it.
Generate, download the ZIP, and paste the snippet into your <head>. Upload the files to the folder you named.

More free tools

Built for our own work, free for yours. No sign-up on any of them.

Font Clamp

Fluid clamp() for font size and its matching line height, across a whole type scale.

Email Signature Generator

Make a professional email signature that holds its shape in Gmail, Outlook and Apple Mail. Fill in your details, pick a layout, copy it and paste it in.

QR Code Generator

Generate styled QR codes with custom colors, dot styles, and logos.

Schema Markup Generator

Build valid JSON-LD for a local business, service, FAQ, article or breadcrumb trail, with every property Google treats as required checked before you paste it.

Meta Tag Preview

See how your page will look as a Google result and as a Facebook, X or LinkedIn card, then copy the tags. Measured by pixel width, which is what actually gets cut.

Color Contrast Checker

Check any two colors against the WCAG contrast rules, get the nearest shade that passes, and convert between HEX, RGB and HSL.

Case Converter

Switch text between sentence case, title case, camelCase, snake_case, and more.

UTM Builder

Tag your campaign links so analytics can tell where the traffic came from. Build a whole campaign at once and take the set out as a CSV.

Image Resizer

Resize images to any width, height or preset size, crop to fit, and convert the format. Batch, and nothing is uploaded.

PDF Compressor

Shrink PDF file sizes right in your browser. Batch upload and ZIP download supported.

Merge PDF

Join several PDFs into one file, in the order you choose. Nothing is uploaded and no quality is lost.

Split PDF

Split a PDF into separate files, or pull out only the pages you need. Pick them from thumbnails or type ranges.

Image Converter

Convert images to WebP, PNG, or JPG. Batch upload and download as a ZIP.

What people use a favicon generator for

The icon set is the last thing anyone remembers and the first thing people see.

Launching a site

One image in, the whole icon set out, before the first deploy rather than as a snag afterwards.

A rebrand

Regenerate every size from the new mark so no old logo survives in a tab or on a home screen.

Handing over to a client

A ZIP and a snippet they can give to any developer, with no account and no dependency on us.

Making a site installable

The manifest carries the name and both Android icons, which is what a browser needs to offer Add to home screen.

Themes that want one file

Plenty of themes ask only for favicon.ico. This builds one with 16, 32 and 48 inside it.

Testing a mark small

The 16 pixel preview shows in seconds whether a logo survives at tab size, which is where most of them fail.

Frequently asked questions

What is in the package, where the files go, and what will not survive at 16 pixels.

Is my image uploaded anywhere?

No. Your image is read in the browser, every icon is drawn on a canvas in your own tab, and the ZIP is put together there too. Nothing is sent to us and nothing is stored, so there is also nothing to delete afterwards. The page does send three counters, how many packages were generated, how many were downloaded, and one per visit. Those are numbers only and carry nothing about your image.

What is actually in the ZIP?

Nineteen files. Sixteen PNGs: three for browsers at 16, 32 and 48, six for Apple devices from 60 up to 180, two for Android at 192 and 512, and five Windows tiles including the wide 310 by 150. Then a favicon.ico with 16, 32 and 48 inside the one file, a site.webmanifest and a browserconfig.xml. The HTML to reference them is on the page, not in the ZIP.

Do I really need all of them?

No, and it is worth saying so. Most sites are covered by favicon.ico, the 32 PNG, the 180 Apple touch icon and the two Android ones. The rest exist for older iOS devices and for Windows tiles, which few sites still care about. They are small and harmless to ship, so the package includes them rather than deciding for you.

Where do the files go, and what is the path field for?

The simplest answer is the root of your site, which is what / means and what most guides assume. If you keep assets somewhere else, put that folder in the path field and every reference in the snippet, the manifest and browserconfig is rewritten to match. Set it before you generate, because it is baked into those files.

Should I use an SVG as the source?

Yes, an SVG is the best source, because it is rasterised cleanly at every size instead of being scaled up from a fixed grid. One thing to check: the file needs a width and height, or a viewBox. Measured in Chrome, an SVG carrying neither is treated as 300 by 150, so a square mark comes out stretched. Almost every exported SVG has one or the other.

Why does my icon look muddy at 16 pixels?

A 16 pixel icon is 256 pixels in total. Fine lines, gradients and any lettering beyond a couple of characters cannot survive that, whatever tool made it. Use the simplest part of your mark, usually the symbol rather than the full lockup, and check the 16 preview before you ship it.

What is the difference between the two icon styles?

Background and margin fills the square with your background colour, insets your image to the size you choose, and can round the corners. It is the right choice for a logo that needs breathing room or has no background of its own. Use my image as it is draws your image straight in with no fill, keeping transparency, which suits a mark that is already square and already has its own backdrop.

My image is smaller than 512 pixels. Does that matter?

The 512 Android icon will be enlarged from what you gave it and will look soft. The tool says so as soon as you choose the file rather than letting you find out afterwards. Everything smaller than your source is fine. If you can, supply 512 or larger, or an SVG, which has no such limit.