Favicon Generator

Generate a complete favicon package — private, free, no account needed.

100% private

Upload one square source image and export the set browsers and devices expect: 16×16, 32×32, and 48×48 PNGs, a 180×180 apple-touch-icon, and a 512×512 icon for Android and PWA home screens, plus the legacy multi-resolution .ico and the web-manifest entries. The bundle includes the head tags ready to paste. Useful for shipping a polished launch where pinned-tab icons and home-screen shortcuts both look right. Resizing happens locally; your source image is not uploaded.

All sizes generated locally — your image is never uploaded.
1
2
3

Drop or tap to create favicon

PNG, JPG, WEBP, SVG · Square image recommended

🔒 All processing is local — your image never leaves your device.

Next steps

Compress image

Shrink images by up to 80% without visible quality loss.

Resize image

Resize to exact pixel dimensions or pick from ready-made presets.

Convert format

Switch between PNG, JPEG, WebP, and more — one file or a batch.

Crop for social

Get pixel-perfect crops for Instagram, Facebook, X, LinkedIn, and YouTube.

View all tools →
Runs right inside your browser tab. No uploads. Your files stay private.

Generate A Complete Favicon Pack For Browsers, iOS, And PWAs

Favicon Generator builds an entire icon pack from a single source image or a piece of text. Each output size is rendered into a Canvas with image-smoothing enabled and re-encoded as a PNG via toBlob, which is what every modern browser uses internally for raster icon export. The legacy favicon.ico file is assembled in the browser by writing a tiny ICO container header and concatenating the 16, 32, and 48 pixel PNGs into a single .ico binary.
The pack includes the sizes that actually matter: 16, 32, and 48 (combined into favicon.ico for legacy browsers and Windows tile fallbacks), 192 (for high-density Android home-screen icons), 180 (apple-touch-icon for iOS, where Safari ignores the alpha channel and applies its own corner radius), and 512 (for Progressive Web App manifest splash screens).
Outputs ship as a single ZIP that includes a paste-ready HTML snippet referencing every file with the correct rel and sizes attributes, plus a web manifest with the icons array filled in. The snippet covers the link tags and meta tag that Lighthouse and PWA Builder look for: icon, apple-touch-icon, manifest, and theme-color.
There are two source modes. Image mode accepts JPG, PNG, WebP, or SVG; the file is decoded into an HTMLImageElement and drawn into each target Canvas with high-quality smoothing. Text mode lets you type any single character (including emoji) and renders it onto a coloured background using the Canvas fillText API, which is the simplest way to ship a placeholder favicon for a prototype.
iOS quirks require attention. Safari rounds the corners of apple-touch-icon and ignores transparent regions, showing a black backdrop behind transparent PNGs added to the home screen. To avoid this, select Solid color as the background before downloading — the tool warns you if you leave the default Transparent setting.
Everything runs locally. The source image lives as a blob URL, all canvases are local DOM elements, and ZIP packaging is done with a small in-page JS implementation. There is no upload step and no server-side image processing, which means the tool works offline once the page is cached.
Two limitations to keep in mind: icons must be square for predictable rendering, and very small text or fine line art often blurs at 16x16 even with smoothing — Apple's Human Interface Guidelines and Google's Material guidance both recommend designing the 16-pixel version separately if your logo has fine detail.

Common Use Cases

01

Launch a new marketing site

Drop your logo in once and get the complete tab, iOS, and PWA icon set ready for deployment without opening Photoshop.

02

Progressive Web App manifest

Generate the 192 and 512 icons that the PWA install banner and Lighthouse audit require, plus a starter manifest.json snippet.

03

Internal dashboard branding

Make it easy to tell apart five staging dashboards open in the same browser by giving each one a distinct emoji or initial favicon.

04

Hackathon and demo prototypes

Use text mode to ship a colourful single-letter favicon in under a minute when there is no logo yet but you still want a polished tab icon.

Frequently Asked Questions

16, 32, 48 (combined into favicon.ico), 180 (apple-touch-icon), 192, and 512 pixels. That set covers every browser tab, Windows tile fallback, iOS home screen, Android Chrome icon, and PWA manifest requirement that Lighthouse audits today.
The 16, 32, and 48 PNGs are first rendered with toBlob, then assembled in the browser into the small binary container the ICO format defines. The result is byte-identical to what command-line tools like ImageMagick produce, just generated client-side.
Safari's apple-touch-icon spec ignores the alpha channel and applies its own square mask. If you export with a Transparent background the alpha is preserved in the PNG, which iOS renders as black. Switch to Solid color in the Background option before downloading — the tool shows a warning if you leave it transparent. Pick a background colour that matches your brand.
Yes. Switch to text mode and type any character or emoji. The character is rendered with Canvas fillText against a coloured background, which is more than good enough for prototypes and internal tools.
JPG, PNG, WebP, and SVG. SVG inputs are rasterised into each output size by drawing the SVG into a Canvas, so the result stays sharp at every resolution. Animated formats like GIF and APNG render as their first frame.
Sixteen pixels is just not enough room for fine detail. Designers usually create a separate simplified version for the smallest size — a single bold initial or a stripped-down mark. The tool can only resample what you give it.
No. The source image is read locally, every output PNG is built in a Canvas, and the ZIP is assembled in JavaScript before download. There is no network call carrying your image bytes.
The download includes a snippet with link tags for favicon.ico, apple-touch-icon, the 192 and 512 icons referenced via the manifest, and a theme-color meta tag. Drop the snippet inside the head of your base layout and you are done.
Yes. The generated site.webmanifest includes the 192 and 512 icons, which is what Chrome's Add to Home Screen flow requires. For maskable icons, redesign your source with a safe zone bleed area and add purpose: "maskable" manually to the manifest entries — maskable requires artwork specifically prepared for that purpose.
Not from the ZIP — you would need to re-upload the source. If you frequently update icons, keep the source SVG in version control and re-run the generator each release.
Maintained by the WebToolVerse teamLast updated Suggest an edit

Advertisement

What's next?
Image Resizer
Image Converter