On-page and SERP
Favicon and Web App Manifest Generator
Turn one logo into a favicon set, a maskable icon, an Apple touch icon, a web manifest and the head tags that link them.
Runs in your browser; nothing is uploaded. · Free, no account · 4 min
The picture stays in this browser tab. Nothing is uploaded.
Hex such as #0b5fff.
Also fills the maskable icon behind your picture.
Used in the links, for example /icons/.
Importing a saved run into your account is coming soon. Until then, your last runs stay in this browser only, and you can download your files.
How to use
- Choose your logo or icon as a PNG, JPEG, WebP or SVG file.
- Enter the app name, short name, start address, display mode, theme colour and background colour.
- Build the icon files and read the warnings about size and shape.
- Download the zip, upload the files to the folder you named, and paste the head tags into your pages.
What it checks and how it works
The tool draws your picture onto canvases in your browser and builds favicon.ico holding 16, 32 and 48 pixel PNG images (an ICO file can store a PNG image whole, as the ICO format description explains), PNG icons at 16, 32, 192 and 512 pixels, a 512 pixel maskable icon, a 180 pixel Apple touch icon, a manifest.webmanifest file, and the link tags for the head. The files are zipped with fflate, and nothing is uploaded.
It follows these sources. Google asks for a square favicon of at least 8 x 8 pixels and recommends larger than 48 x 48. web.dev says the important content of a maskable icon must sit inside a circle in the centre whose radius is 40 percent of the icon width, so the maskable file scales your picture into that circle on your background colour. MDN lists the members and purpose values of the manifest icons. Apple's guidance names 180 x 180 pixels for the retina iPhone touch icon.
Limits: a picture smaller than 512 pixels is scaled up and looks soft, and a picture that is not square is centred with space around it. The browser rasterizes an SVG. Whether a browser offers to install the site depends on that browser's own install criteria, which this tool does not check.
Sources
- Google Search Central: Define a favicon to show in search results opened 29 Oct 2026
- web.dev: Adaptive icon support in PWAs with maskable icons opened 29 Oct 2026
- MDN Web Docs: Web app manifest, icons member opened 29 Oct 2026
- Apple: Configuring Web Applications (Safari Web Content Guide) opened 29 Oct 2026
- Wikipedia: ICO (file format), the ICONDIR layout and PNG images inside ICO opened 29 Oct 2026
Related tools
Open Graph and X Card Meta Tag Generator
Build the Open Graph and X card tags for a page and preview the share card.
Meta Tag Extractor
List every meta tag, link relation, Open Graph tag and JSON-LD type in a page's head, and see what is missing.
Image to WebP and AVIF Converter
Convert images to WebP or AVIF in your browser, set the quality, and see how much each file shrinks.
Color Converter: HEX, RGB, HSL and OKLCH
Convert colors between HEX, RGB, HSL and OKLCH, one or many at a time, in CSS syntax.
Questions
About this tool
Google requires a square favicon of at least 8 x 8 pixels and recommends larger than 48 x 48. The tool also builds 192 and 512 pixel icons for the manifest.
An icon whose artwork sits inside a central safe zone so a device can crop it to a circle, square or other shape. web.dev defines the safe zone as a circle with a radius of 40 percent of the width.
No. The picture is read and resized in your browser and the zip is built there, so nothing is sent to a server.
Get started today
Find out where your brand stands in AI. Free.
Run a free AI visibility analysis on your domain. No credit card, results in minutes. See what AI engines say about your brand today.
Brands already measuring their AI visibility with Zaher.
