Favicon Generator

A favicon is the small icon shown in browser tabs and bookmarks and, for many sites, next to the result in Google Search. Browsers and phones ask for it in several sizes and formats, so one image file is rarely enough.

The Favicon Generator resizes your image or lettermark to the standard set, builds a multi-size favicon.ico, and writes the HTML link tags and the web manifest that point to those files. You download them as one ZIP and upload them to your site root.

All image processing uses your browser canvas. Nothing is uploaded.

1. Choose a source: Upload a square logo, or leave the file box empty and type 1 to 3 letters for a lettermark. A square image of 512 px or more gives the sharpest result.
2. Pick shape and colours: Choose square, rounded or circle, then enter the background and text colour as hex codes such as #6b352a. Tick the transparent option if your logo already has its own shape.
3. Set the padding: Raise the padding if the logo touches the edges. At 16 px fine detail disappears, so simple marks work best.
4. Check the previews: The tool shows 16, 32, 48 and 180 px versions at real size next to a mock browser tab. Judge the 16 px version, because that is the one people see in a tab.
5. Download and install: Download the ZIP, upload the files to your site root and paste the HTML snippet into the head of your pages. WordPress also has a Site Icon setting under Appearance > Customize > Site Identity that takes one square image of at least 512 px.

A lettermark favicon for a brand called Digital Mansoor, using the letters DM on a rounded brown square.

The file list is the real output of the live tool. The tool also shows a preview of each size and the snippet to paste into your head.

• Replaces the usual chain of an image editor, an ICO converter and a hand-written manifest with one step.
• Covers the gaps that sites often ship with: no Apple touch icon, no 192 and 512 px icons for Android home screens, and a blurry 16 px icon.
• Gives you the exact link tags, so you do not guess file names or sizes.
• Lets a small site without a designer ship a clean lettermark favicon in a few minutes.

• Builds a real ICO container with 16, 32 and 48 px images inside, not a renamed PNG.
• Makes the 180, 192 and 512 px icons with a solid background, because iOS fills transparent areas with black.
• Puts the web manifest and the head snippet in the same ZIP, so nothing is left to write by hand.
• Previews the icon at true size beside a mock tab, which shows legibility problems before you upload.
• Adds no watermark and asks for no signup.

• Letter favicons use fonts installed on your device (Arial, Georgia, Trebuchet MS, Courier New), so the same letters can look slightly different on another computer.
• The tool does not trace or redraw artwork. A detailed logo scaled to 16 px looks muddy. Use a simplified mark.
• It does not make SVG favicons, Windows tile icons or Safari pinned-tab icons.
• Google decides whether to show your favicon in search. Meeting its guidelines does not guarantee it, and a recrawl can take days to weeks.

Your image is read and resized in your browser with the canvas API. It is not uploaded to my server and not stored.