Favicon Generator

Make a favicon from an image, an emoji or your initials โ€” preview every size, download the PNGs, and copy the HTML to paste into your site.

How to use the favicon generator

  • Choose Text/Emoji (type initials or an emoji and pick colours) or Upload image.
  • Check the previews at each real size โ€” 16ร—16 is the true test of whether your design reads.
  • Download the PNGs into your site root and paste the HTML into your <head>.

Which favicon sizes you actually need

Modern browsers are flexible, but the practical set is: 16ร—16 and 32ร—32 for browser tabs and bookmarks, 180ร—180 for the Apple touch icon on iOS home screens, and 192ร—192 plus 512ร—512 for Android and progressive web apps. Design for the smallest size first โ€” fine detail and long words disappear at 16 pixels, so a single bold letter, a simple mark or an emoji almost always beats a shrunken full logo.

Benefits

  • Builds favicons from an image, an emoji, or your initials with custom colours.
  • Previews every real size, including the crucial 16ร—16.
  • Downloads all standard sizes plus the Apple and Android icons.
  • Gives you the exact HTML snippet to paste into your head.

Limitations to know

  • It outputs PNGs, not a multi-resolution .ico file.
  • Uploaded images are centre-cropped to a square.
  • Detailed logos lose legibility at 16ร—16 โ€” that is a design limit, not a tool bug.

Common mistakes to avoid

  • Designing at 512 and never checking how it looks at 16 pixels.
  • Using a full wordmark instead of a single letter or simple symbol.
  • Uploading the files but forgetting to add the HTML link tags.

Alternatives

To resize an image first use the Image Resizer; for a circular crop use Round Image Maker.

Last updated: August 2026 ยท Reviewed by the AI Toolbox editorial team.

Frequently asked questions

Is my image uploaded?

No โ€” everything is drawn on a canvas in your browser. Your image never leaves your device.

Do I need an .ico file?

Not for modern browsers โ€” PNG favicons are fully supported. An .ico is only needed for very old versions of Internet Explorer.

Where do the files go?

Usually the root of your site, then reference them with the HTML snippet shown here.

Why does my logo look blurry?

Detailed logos don't survive being scaled to 16 pixels. Use a simplified mark or a single letter for the small sizes.

Related tools