Preview: No logo selected yet
Drag a corner of the highlighted box to resize it, or drag inside it to reposition — everything dimmed outside it is trimmed away. The favicon is always square.
Space around your logo. A little padding often reads better at 16px.
50% makes a circle. Most visible with a background color.
This favicon generator turns a logo or image into the complete set of icon files a modern website needs, packaged as a single ZIP. You get a classic favicon.ico (bundling the 16×16, 32×32 and 48×48 sizes browsers expect), favicon-16x16.png and favicon-32x32.png, an apple-touch-icon.png for iPhone and iPad home screens, Android and PWA icons at 192×192 and 512×512, and a site.webmanifest that ties them together. Upload a PNG, JPG or SVG, then drag the corners of the square selection to frame exactly the part of your logo you want. The rest is trimmed, not squashed. Add padding or rounded corners, keep the background transparent or fill it with a color, and check the live preview, which shows your icon at its true size in light and dark browser tabs, before you download. Small sizes are produced by shrinking your image in several halving steps rather than one big jump, which keeps 16×16 icons crisp instead of jagged. Everything runs in your browser, and the page gives you a ready-to-paste HTML snippet for your site's <head>.
There isn't just one size. Browsers use 16×16 for tabs and 32×32 on high-resolution screens and in bookmarks, and Windows uses 48×48 for site shortcuts. All three are bundled inside favicon.ico. iPhones and iPads use a 180×180 apple-touch-icon.png when someone adds your site to their home screen, and Android uses 192×192 and 512×512 PNGs listed in site.webmanifest. This generator makes every one of those from a single upload, so you never have to resize anything by hand.
Yes. Browsers still request /favicon.ico from your site's root by default, even when a page doesn't mention it, and some apps, like RSS readers and bookmarking tools, only ever look for that file. Keep favicon.ico for compatibility and add the PNGs for sharper icons on modern devices. The HTML snippet this tool gives you includes both.
At 16×16 pixels there's only room for a simple shape, so wordmarks, thin lines and fine detail blur together. Crop to just the symbol or first letter of your logo instead of the whole thing, and check the enlarged 16×16 preview before downloading. A little padding and a solid background color can also make the icon stand out in a crowded tab bar. This tool shrinks your image in several halving steps instead of one jump, which keeps edges as clean as possible.
Browsers cache favicons aggressively, often for much longer than the page itself. After uploading the new files, open your site in a private window or do a hard refresh (Ctrl+Shift+R, or Cmd+Shift+R on a Mac) to check it. Make sure the files are in your site's root folder, so /favicon.ico loads in the browser, and that the <link> tags are inside <head>. Google Search updates the favicon shown in results on its own schedule, which can take days or weeks after it next crawls your homepage.
Transparent is the usual choice because the icon blends into whatever tab color the browser uses. The catch is dark mode: a dark logo on a transparent background can almost disappear on a dark tab bar. Use the light and dark tab previews to check. If your logo vanishes on one of them, add a background color, ideally with rounded corners.
No. Every file, including the .ico, the PNGs, the manifest and the ZIP, is created in your own browser. Your image never leaves your device.