How to create a favicon package and install the right files

Prepare a simple, supported source image

Choose a recognisable symbol that remains understandable at a small size. Open the Favicon Generator with one still PNG or JPEG. SVG, WebP and animated PNG inputs are not supported here. The file limit is 8 × 1024 × 1024 bytes, with at most 8 million pixels and 4096 pixels on either side. A large photographic logo with tiny lettering may become unreadable even when the file passes those limits. Keep your original artwork; generating raster icons does not recreate missing detail.

Choose the site name, padding and background

Enter a Website name, for example Example Studio, using at most 80 characters. Select Padding per side from 0%, 5%, 10%, 15%, 20% or 25%, and choose Keep transparency or White. The image is fitted inside a square without cropping or stretching. A rectangular source therefore leaves space around it. The transparent-canvas choice does not cut an opaque background out of a JPEG logo. Select Create icons and review the actual-size 16, 32 and 192 pixel previews before downloading.

Inspect the ten-file ZIP package

Download ZIP produces favicons.zip. It contains favicon.ico with 16, 32 and 48 pixel frames; PNG files at 16, 32, 48, 180, 192 and 512 pixels; site.webmanifest; head-snippet.html; and README.txt. The 180 pixel image is apple-touch-icon.png, while the 192 and 512 images use android-chrome filenames. The package is raster-based and includes no SVG icon. If an upscaling warning appears, check the small icons particularly carefully; enlarging a small input cannot restore its missing features.

Merge the files into the receiving website

Read README.txt and head-snippet.html after extracting the ZIP. The supplied links assume the files are placed at the website root. Adapt the paths if your site serves assets elsewhere, and place the appropriate links in the HTML head through your website’s supported setup. If a web manifest already exists, merge the icon entries rather than overwriting its application settings. This generated manifest declares ordinary icons, not maskable artwork, and does not configure a service worker or make the site installable by itself.

Check the installed icon rather than only the preview

Open the installed icon URLs and check the website in the browsers and devices you intend to support. Verify legibility against the chosen background and at tab-icon size. Google’s search favicon setup requires the home page and icon to be crawlable; following the guidelines does not guarantee display in results. Generating or downloading this package does not upload files to your host or update your site. Image processing happens locally in the browser. Keep the checked source and package so a later brand change can be reproduced.

Sources

• Google Search Central: Favicon setup
• Kervoni: Package contents and placement rules