Favicon Generator — favicon.ico, PNG and SVG From an Image or Text

Turn a PNG, JPG or SVG logo — or a letter or emoji — into favicon.ico, every PNG size and a favicon.svg. One file or the whole pack.

🔒 Runs in your browser — files never uploaded ⚡ No signup 💯 Free

Drop your logo here or tap to browse PNG, JPG, WebP or SVG · square and at least 512×512 works best · stays in your browser

Make a favicon the way you need it. Drop in a PNG, JPG, WebP or SVG logo, or type a letter, initials or an emoji and pick the colours. Then download just the file you came for — a 32×32 favicon.ico, a 16×16 PNG, a 180×180 Apple touch icon — or the complete pack: a multi-size favicon.ico, every PNG that browsers and phones ask for, a favicon.svg, a web manifest and the HTML for your <head>.

Live previews show the icon at 16, 32 and 48 pixels and inside a light and a dark browser tab, so you can see whether it still reads before you ship it. Everything is drawn in your browser; the image never leaves your device.

How to use Favicon Generator

Choose a source. Drop a logo on the "From an image" tab (square and at least 512×512 is ideal), or switch to "From text or emoji" and type one to three characters.
Adjust it. Pick a background colour or keep transparency, add padding, round the corners (50% gives a circle), and for a non-square logo choose whether to keep it whole or crop it to fill.
Download one file from the "Just one file" row — for example favicon.ico 32×32 — or click Generate favicon pack for everything as a ZIP, with each file also downloadable on its own.
Upload the files to your site's root folder and paste the HTML snippet into your <head>.

Which favicon files do you actually need?

For most sites in 2026, four files cover everything: favicon.ico (for old browsers and anything that requests /favicon.ico directly), favicon.svg or a 32×32 PNG (modern browsers' tabs), apple-touch-icon.png at 180×180 (iPhone and iPad home screens) and a 192 and 512 PNG listed in site.webmanifest (Android and installable web apps). The pack includes all of them plus 16 and 48 pixel PNGs, and the HTML snippet references them correctly.

Making a favicon from a PNG

Start from the largest, simplest version of your logo, ideally a square PNG with a transparent background at 512×512 or more. A wide wordmark will not read at 16 pixels: use just the symbol or the initial. If the image is not square, "Whole image" keeps everything and adds transparent space, while "Fill the square" crops the edges, which suits photos and busy artwork. Padding gives the icon breathing room, which matters most on the Apple touch icon, where iOS draws it on a rounded tile.

A favicon from letters or an emoji

No logo yet? A bold initial on a coloured tile is what many well-known sites use, and an emoji is the quickest favicon there is. The text mode fits the characters to the tile at every size and also writes a real favicon.svg, a vector icon that stays sharp at any resolution. Emoji are drawn with your system's emoji font, so they look slightly different on Windows, macOS and Android; the PNG and ICO files freeze the version you see here.

favicon.ico sizes: 16, 32, 48 and beyond

An ICO file is a container that can hold several sizes, and the browser or operating system picks the best one. 16×16 and 32×32 are the essentials (tabs and high-DPI tabs), 48×48 is used by Windows and by Google's search results, and 64 to 256 are only for desktop shortcuts. The defaults here are 16, 32 and 48; tick more if you need them. If a form or CMS asks for "a 32×32 favicon.ico", use the single 32×32 button. The ICO entries are stored as PNG, which every browser since Internet Explorer 9 and Windows Vista reads.

Design for 16 pixels, not for 512

A detailed logo that looks superb at full size becomes a smudge in a browser tab. At 16×16 you have 256 pixels: enough for one bold letterform or one simple shape. Watch the 16px preview and the dark tab: a black logo on a transparent background disappears on dark browser themes, so add a light tile or padding if it vanishes there. Many strong brands use a different, simpler mark for the favicon than for the logo, and that is the right instinct.

If the new favicon does not appear

Browsers cache favicons aggressively, often beyond a normal hard refresh. Load yourdomain.com/favicon.ico directly and refresh it, or open the site in a private window; it is almost always caching rather than a broken file. Files belong in the site root, not a subfolder, because browsers request /favicon.ico from the root even without a <link> tag. Google's results show the favicon only after it recrawls your home page, which can take days. To check other images, the image resizer and image converter handle general resizing and format changes.

Frequently asked questions

How do I make a 32×32 favicon.ico?

Drop in your image (or type a letter or emoji), then click favicon.ico 32×32 in the "Just one file" row. You get an ICO containing a single 32×32 image. For a 32×32 PNG instead, click PNG 32×32.

Can I create a favicon from a PNG?

Yes. Drop the PNG on the "From an image" tab. Transparency is kept unless you choose a solid background, and a non-square PNG can be kept whole or cropped to fill the square. JPG, WebP and SVG work the same way.

What size should my source image be?

At least 512×512 pixels and square, so that the 512 PNG for Android is sharp. Smaller images still work but the larger sizes will look soft. An SVG source is ideal because it has no size; it is also included unchanged as favicon.svg.

Do I still need favicon.ico in 2026?

It is still worth having. Some browsers, feed readers, email clients and crawlers request /favicon.ico directly and ignore the HTML tags. A small ICO with 16, 32 and 48 pixel images costs a few kilobytes and covers them all, while modern browsers use the SVG or PNG from the <link> tags.

Can I make a favicon from text or an emoji?

Yes. Switch to "From text or emoji", type one to three characters or tap a quick-pick emoji, and choose the font, colours and corner rounding. The pack then also contains a vector favicon.svg of the same design.

Where do the files go and what HTML do I need?

Upload every file to the root folder of your website, next to your home page. Then paste the HTML snippet shown after generating into the <head> of every page (in WordPress, use the Site Icon setting or your theme's header).

My new favicon is not showing. Why?

Almost always caching. Open yourdomain.com/favicon.ico in the browser and refresh it, or check in a private window. Google search results update the favicon only after recrawling your site.

Why does my logo look bad at 16px?

Because 16×16 is only 256 pixels. Thin strokes and small text vanish. Use the simplest part of the logo, add a contrasting background tile, and check the 16px preview and the dark tab preview until it reads clearly.