Favicon generator
Pick a letter or emoji with colours, or use your own picture, and get the standard favicon sizes as PNG, a favicon.ico with three sizes inside, and the link tags to paste into your page head.
Runs in your browser: nothing you enter is sent anywhere.
How to use it
- Choose Letter or emoji, type up to three characters and pick colours and a shape. Or choose My image and drop a picture.
- Check the previews for each size.
- Press Download all files, or download a single size or just the ICO.
- Copy the HTML snippet into the
<head> of your site.
How it works
Every size is drawn from scratch on its own canvas instead of shrinking one big image, so small icons stay sharp. A picture is cropped to the largest centered square: an 800 × 600 photo uses the middle 600 × 600 pixels. The ICO file is built in your browser from the 16, 32 and 48 pixel PNG images.
File names
favicon.ico – 16, 32, 48favicon-16x16.png, favicon-32x32.png, favicon-48x48.pngapple-touch-icon.png – 180 × 180android-chrome-192x192.png, android-chrome-512x512.png
Tips
- One bold letter reads better at 16 px than a detailed picture.
- Use strong contrast between background and text.
Frequently asked questions
Which favicon sizes do I need?
A favicon.ico (16, 32 and 48 px) covers browsers and older tools. The 32 px and 16 px PNGs are for browser tabs, the 180 px file is the Apple touch icon for iPhone and iPad home screens, and 192 and 512 px are used by web app manifests on Android.
How is the ICO file made?
The tool writes the ICO container itself: a small header, one directory entry per size, then the three PNG images. Modern browsers and Windows read PNG images inside ICO files.
Can I use an emoji?
Yes. Type one emoji or up to three characters. The emoji is drawn with your device's emoji font, so it may look different on another system, but the generated file always shows what you see in the preview.
Where do I put the files?
Upload them to the root of your site so the paths in the snippet work, for example /favicon.ico, then paste the snippet inside the head tag of your pages. Browsers also look for /favicon.ico by default.