Create a complete favicon set in seconds
A favicon is the small icon shown in browser tabs, bookmarks, search results and on phone home screens. A modern site needs several sizes of it, plus a favicon.ico for older browsers and tools. This free favicon generator creates the whole set from your logo or from simple letters or an emoji, along with the HTML tags and web app manifest to install it.
You get a real multi-size favicon.ico (16, 32 and 48 px), PNG icons at 16, 32, 48, 180, 192 and 512 px, an apple-touch-icon for iPhones and iPads, and a site.webmanifest for Android — all in one ZIP. Live previews show how the icon looks in a browser tab and on a home screen. Everything is drawn in your browser, so your logo is never uploaded.
How to use the Favicon Generator
- Choose “Text or emoji” and type one to three characters, or choose “Image” and upload your logo (a square PNG or SVG with a transparent background is ideal).
- Adjust the font, colours, shape (square, rounded or circle) and padding. For images, pick whether the logo should fit inside the square or crop to fill it.
- Check the previews, especially the tiny 16 px and 32 px versions — simple, bold shapes read best.
- Enter your site name, then press “Download all (ZIP)”.
- Upload the files to the root folder of your website and paste the HTML tags into the <head> of every page.
Favicon Generator features
Real multi-size ICO
favicon.ico is written in the official ICO container with embedded 16, 32 and 48 px PNG images, not a renamed PNG.
Every size you need
PNG favicons for browsers, a 180 px apple-touch-icon and 192/512 px icons for Android and progressive web apps.
Text, emoji or logo
Build a clean letter mark or emoji icon with your brand colours, or convert an existing logo.
Shape and padding control
Square, rounded or circular backgrounds, transparent or solid, with adjustable breathing room.
Ready-to-paste code
Correct <link> tags, theme colour and a site.webmanifest are generated and included in the ZIP.
Private
Icons are rendered with your browser’s canvas; nothing is sent to a server.
Which favicon sizes are used where
| File | Size | Used by |
|---|---|---|
| favicon.ico | 16, 32, 48 px | All browsers, Windows shortcuts, RSS readers, tools that request /favicon.ico |
| favicon-16x16.png / 32x32.png | 16 / 32 px | Browser tabs and bookmarks (32 px on high-density screens) |
| favicon-48x48.png | 48 px | Google Search results (needs a multiple of 48 px) |
| apple-touch-icon.png | 180 px | iPhone and iPad “Add to Home Screen” |
| android-chrome-192x192.png | 192 px | Android home screen, PWA install |
| android-chrome-512x512.png | 512 px | PWA splash screen and app stores |
Installing the favicon on your website
- Unzip and upload all files to the root of your site, so that
https://yoursite.com/favicon.icoopens the icon. - Paste the generated tags inside
<head>on every page. In WordPress, you can instead upload the 512 px PNG under Appearance → Customize → Site Identity → Site Icon. - If your site lives in a sub-folder, change the leading “/” in each path to match.
- Browsers cache favicons aggressively. If the old icon still shows, open the .ico URL directly, hard-refresh, or test in a private window.
- Google may take days or weeks to show a new favicon in search results; make sure it isn’t blocked by robots.txt.
Design tips for small icons
At 16 × 16 pixels there is room for one idea. Use a single bold letter, a simple symbol or the most recognisable part of your logo rather than the full wordmark. Strong contrast between the icon and its background matters more than fine detail, and a solid background makes the icon visible on both light and dark browser themes.
The apple-touch-icon is always given a solid background because iOS shows transparent areas as black, and iOS rounds the corners itself — so it is exported as a square. If you start from vector artwork, render a large PNG first with SVG to PNG, and pick harmonious brand colours with the Color Palette Generator. Add social sharing tags with the Meta Tag Generator.
Favicon Generator FAQ
How do I make a favicon from my logo?
Choose “Image”, upload your logo, decide whether it should fit inside the square or fill it, then press “Download all (ZIP)”. A square logo with a transparent background gives the cleanest result.
Is the favicon.ico a real ICO file?
Yes. The generator writes a genuine ICO container holding 16, 32 and 48 px images stored as PNG, which Windows Vista and later and every modern browser support.
Can I use an emoji as a favicon?
Yes. Choose “Text or emoji” and type or paste an emoji. It is drawn with your device’s emoji font, so it may look slightly different on Windows, macOS and Android.
Do I still need favicon.ico in 2024 and beyond?
Modern browsers can use PNG icons via the <link> tags, but many tools, feed readers and some browsers still request /favicon.ico automatically, so including it avoids 404 errors and missing icons.
Why isn’t my new favicon showing?
Favicons are cached for a long time. Check that the files are in your site’s root folder, that the tags are in the <head>, then clear the cache or open the site in a private window.
Is this favicon generator free?
Yes — free, no sign-up and no watermark. Your images are processed locally in the browser.