Convert PNG, text, or emoji into a complete favicon package.
Download ICO + all PNG sizes + site.webmanifest in one click.
Choose PNG, Text, or Emoji mode. Customize colors, fonts, and shapes until your favicon looks perfect.
Click "Download Favicon Package". You'll get a ZIP with ICO, all PNG sizes, and a webmanifest.
Drop the files in your website root and paste the HTML snippet from the README into your
.Every file your website needs across all browsers, OS, and devices.
<link rel="icon" type="image/x-icon"
href="/favicon.ico">
<link rel="icon" type="image/png"
sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png"
sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon"
sizes="180x180"
href="/apple-touch-icon.png">
<link rel="manifest"
href="/site.webmanifest">
A favicon is the small icon that represents your website — the tiny image in the browser tab, next to a bookmark, in mobile search results, and on a phone’s home screen when someone saves your site. It is easy to overlook because it is small, but it is one of the most visible pieces of your brand: people see it every time they have your site open.
This generator takes a single image and produces every size and format that modern browsers and devices expect — from the classic 16×16 tab icon to large Apple touch icons — bundled in a ready-to-use ZIP. There is no design software to learn and no guessing about which sizes you actually need.
Start with a square logo or icon. A PNG with a transparent background works best, and a larger source image gives sharper results.
The tool creates each required favicon size and format automatically, including ICO, PNG and Apple touch icons.
See how your icon will look in a real browser tab before you download, so there are no surprises.
Grab the ZIP, drop the files into your site’s root, and add the provided link tags to your HTML head.
When a visitor has a dozen tabs open, a distinctive favicon helps them find yours at a glance. It is a small detail that keeps your brand visible.
A missing favicon leaves a generic globe or a blank square, which quietly makes a site feel unfinished. A proper icon shows the details were handled.
Add-to-home-screen on iOS and Android uses larger icons. Generating the full set means your site stays crisp whether it is a tab or a home-screen shortcut.
Google displays favicons next to results on mobile. A clear icon can make your listing stand out on a page full of plain text.
Favicons shrink down a lot, so begin with a large, clean, square source (at least 512×512). Upscaling a small image just produces a fuzzy icon.
Fine text and intricate details disappear at 16×16. A simplified mark, monogram or symbol reads far better at small sizes than a full wordmark.
iOS uses a separate, larger icon for home-screen shortcuts. Skip it and Safari falls back to a screenshot of your page, which rarely looks good.
Browsers cache favicons aggressively. If an update does not appear, do a hard refresh or test in a private window before assuming something is wrong.
Uploading the files to your server is not enough on its own. Add the provided link tags to your HTML head so browsers know where to find each size.