CometWeb tools
PWA icon generator & favicon generator: PNG, SVG
Build favicon files and PWA icons from PNG or SVG locally in your browser
Generated variants
Your logo will appear here
Add a file to preview seven sizes. Download only the ones you need.
What makes up a modern favicon set?
A single root favicon.ico is no longer enough. You usually need several variants: multi-size PNG, Apple touch icon, Android icon, and a PWA manifest.json.
This generator builds the PNG icons from one source (PNG, or SVG rasterized to a bitmap, ideally 512×512+) and shows an HTML snippet for <head>.
Everything runs in the browser via the canvas API and nothing is uploaded. SVG is drawn to canvas first, then exported as PNG.
Design for the smallest icon
Review the logo at 16×16 before downloading larger variants. Small lettering and thin lines may disappear. If they do, use a simplified symbol instead of shrinking the full brand mark.
Key sizes
- 16×16favicon-16.png
- Browser tab. Keep the mark simple.
- 32×32favicon-32.png
- Standard HiDPI tab icon.
- 180×180apple-touch-icon.png
- iOS home-screen icon. Available to download above.
- 512×512favicon-512.png
- Large PWA icon referenced in manifest.json.
A PWA icon generator prepares 192×192 and 512×512 icon files from a PNG or SVG source. This generator runs locally in your browser and does not upload the image.
Upload a PNG or SVG, set the background and padding, then download 16×16, 32×32, 48×48, 96×96, 192×192 and 512×512 variants. The generator runs locally in your browser and does not upload the image.
Often yes for older clients. Modern browsers prefer PNG.
Upload a square PNG or SVG, choose the background and padding, then download the icon variants. The generator runs locally in your browser.
The common manifest sizes are 192×192 and 512×512 px. This generator also creates smaller favicon variants: 16×16, 32×32, 48×48 and 96×96 px.
Android does not show your icon as you drew it. It crops it to a shape of its own choosing: a circle, a rounded square, a squircle. A maskable icon is one drawn to survive that, with everything important inside the central 80%, which the spec calls the safe zone, and on an opaque background, because transparency under a crop shows whatever sits behind it. Without one, Android pads your flat icon inside a white circle instead. This generator produces a 512×512 maskable variant alongside the flat icons.
Because the two declarations mean different things. An icon marked purpose "any" is used as drawn and gets no adaptive treatment on Android; one marked "maskable" is assumed to carry a safe zone, so anything that is not Android draws it padded and small. Shipping both is what the spec expects, and it is what the manifest this tool generates does.
At least 512×512. SVG is ideal.
Safari tints the icon with one color. Keep a simple single-path SVG.
What else might come in handy
Icons ready? Explore the scope of an Insight SEO audit before your next site release.