Prepare website icons
Create a real multi-size favicon.ico plus browser, Android, and Apple PNG icons in one package.
JPG, PNG, WebP, or AVIF · up to 32 MB · adaptive 8–24 megapixel limit
Your image never leaves this browser
Images stay in browser memory and are never uploaded by these tools.
Decode and export JPG, PNG, WebP, and AVIF using browser and WebAssembly codecs.
Re-encoding can alter metadata, animation, profiles, or quality, so verify every output.
Complete tool guide
Create every icon a website needs from one logo or image: a real multi-size favicon.ico, 16 and 32 px PNG favicons, a 180 px Apple touch icon, 192 and 512 px Android and PWA icons, a site.webmanifest, and ready-to-paste HTML link tags. Choose whether the artwork is padded or cropped to a square, then download everything as one ZIP.
Your input is processed in the current browser tab and is not sent to the application server.
Choose a square logo or image, ideally at least 512 × 512 px, in JPG, PNG, WebP, or AVIF.
Pick Contain full image to keep all the artwork, or Fill and crop to fill the square edge to edge.
Leave Transparent padding on, or turn it off and choose a padding background color.
Select Generate favicons, check the 256 px preview, then download favicon.ico or the full pack.
Scales the whole image to fit inside the square and centers it. Wide or tall artwork gets padding above and below or on the sides.
Scales the image until the square is completely filled and crops the overflow from the center. Use it for photos or when the important part of a wide logo is in the middle.
With Transparent padding on, empty areas stay see-through. Turn it off to fill the square with a solid color, which also sits behind any transparent parts of your artwork in every icon.
Start with: acme-logo.png · 512 × 512 px · transparent background
favicon-pack.zip
favicon.ico (16, 32, 48, 256 px)
favicon-16x16.png · favicon-32x32.png
apple-touch-icon.png (180 px)
android-chrome-192x192.png · android-chrome-512x512.png
site.webmanifest (name: "acme-logo") · head-tags.htmlA square source maps cleanly onto every size, so Contain and Fill give the same result. Change the manifest name from "acme-logo" to your site’s real name before publishing.
Start with: wordmark.png · 1200 × 400 px (3:1)
Contain: the logo is about 16 × 5 px inside the 16 px icon
Fill and crop: the square shows only the center 400 × 400 px of the sourceContain scales by the shorter fit, 16 ÷ 1200, leaving a sliver that is unreadable. Fill scales by 16 ÷ 400 and crops the sides, which can cut off letters. A square crop of the logo mark is usually the best favicon.
favicon.ico (16, 32, 48, and 256 px), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 × 180), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest, and head-tags.html with the link tags. The files are meant to go in your site’s root folder.
site.webmanifest uses your file name as the app name, a short name of up to 24 characters, white theme and background colors, and standalone display. Open it in a text editor to set your real site name and brand colors before publishing.
At 16 × 16 px an icon has only 256 pixels, so thin lines, small text, and fine detail disappear. A bold symbol, a single letter, or a simplified mark reads far better than a full wordmark.
For most sites: favicon.ico, 16 and 32 px PNGs for browser tabs, a 180 px Apple touch icon, and 192 and 512 px icons referenced from a web app manifest. This pack includes all of them.
Unzip the pack, upload all files to the root of your site (the same folder as your home page), and paste the contents of head-tags.html inside the <head> of every page or your site template.
Yes. It uses the standard ICO directory format and contains four PNG-compressed images at 16, 32, 48, and 256 pixels, which all current browsers and Windows support.
Browsers cache favicons heavily. Check that the files are at the paths in the link tags, then hard-refresh or use a private window. Google Search may take days or weeks to recrawl and update the icon it shows.
Not directly; the generator accepts JPG, PNG, WebP, and AVIF. Export your SVG as a 512 px or larger PNG first, then use that here.
Keep working
Continue with another focused tool from the same collection.