Drop in a PNG, JPG, WebP or SVG, or type a letter, initials or an emoji on a colored background. Choose a square, rounded or circle shape, and how much space to leave around it.
Images
Favicon Generator
Upload a logo, or type a letter or emoji, and get every icon a site needs: the browser tab icon, the iPhone and Android home screen icons, a manifest and the tags to add.
Quick guide
How to use this tool
Choose An image and drop in a square logo (512 × 512 pixels or larger is best), or choose A letter or emoji and type one or two characters.
Set the Background color or make it transparent, the Shape (Square, Rounded or Circle) and the Space around it. Add a site name and theme color for the manifest and head tags.
Check the icons, then press Download all (.zip) for favicon.ico, the PNG sizes, site.webmanifest and the head tags, or download single files. Upload them to the root of your site and copy the tags into the head of your pages.
How to use this tool
Choose An image and drop in a square logo (512 × 512 pixels or larger is best), or choose A letter or emoji and type one or two characters.
Set the Background color or make it transparent, the Shape (Square, Rounded or Circle) and the Space around it. Add a site name and theme color for the manifest and head tags.
Check the icons, then press Download all (.zip) for favicon.ico, the PNG sizes, site.webmanifest and the head tags, or download single files. Upload them to the root of your site and copy the tags into the head of your pages.
Source and styleStart from a picture, or make one from a letter
Shape
For the web app manifest.
Colors the browser bar on phones.
Your iconsDownload them all, or one at a time
No image yet
Add a logo or picture and the icons appear here. Nothing is uploaded.
What it handles
One image in, a full icon set out.
A site needs several icon sizes: one for the browser tab, one for phones' home screens, and more for Android and app stores. This makes them all from one source.
favicon.ico with 16, 32 and 48 pixel images, PNGs at 16, 32, 180, 192 and 512 pixels, and a site.webmanifest that points Android at its icons.
Download everything as one ZIP, or pick single files. Copy the exact link tags for your page head, with your theme color.
Frequently asked questions
What size should my source image be?
A square image of at least 512 × 512 pixels. Smaller images still work, but the larger icons will look soft. An SVG is ideal because it stays sharp at every size.
Where do the files go?
In the root folder of your site, so they load from addresses such as /favicon.ico. Then add the tags to the head of your pages. Browsers also look for /favicon.ico on their own.
Why so many sizes?
Each place that shows your icon asks for its own size: browser tabs use 16 and 32 pixels, iPhones use 180, and Android and installed web apps use 192 and 512. Providing each avoids a blurry, resized copy.
Why does my favicon not change in the browser?
Browsers cache favicons for a long time. After uploading new files, force a reload, or open the page in a private window to see the new icon straight away.
Does a logo with a transparent background work?
Yes. PNG and SVG transparency is kept unless you choose a background color. For iPhone home screens, which show transparency as black, give the icon a solid background.