Generate a complete favicon set — 16px to 512px, apple-touch-icon, and a manifest.json — from one image, entirely in your browser.
A zero-dependency favicon workbench. Drop in one square-ish image, get back every PNG size a modern site needs, a ready-to-paste
<head>snippet, and a validmanifest.json— nothing ever leaves your machine.
Favicon Generator Pro is part of the Web Utility Suite. It runs entirely in the browser with no build step, no frameworks, and no network calls — open index.html from disk and it works. Upload an image and it's automatically center-cropped to a square, then downscaled with <canvas> into every target favicon size. Each size gets a live preview on a checkerboard backdrop (so transparency is visible), its generated file size, and an individual download button — plus copy-paste manifest.json and <head> HTML blocks so you can wire the results into a real site in seconds.
- Drag-and-drop or click-to-browse upload — accepts PNG, JPG, WEBP, SVG, GIF, and BMP.
- Square-crop-then-resize pipeline — the source image is always center-cropped to a square (cover-fit crop, no distortion) into a high-resolution master canvas first, then every target size is downscaled from that master. This means results look correct regardless of the source image's aspect ratio.
- Six target sizes generated as real PNGs:
16×16,32×32,48×48,180×180(apple-touch-icon),192×192, and512×512— all produced client-side viacanvas.toBlob('image/png'). - Live per-size preview — each generated size is rendered on a checkerboard background (derived from the shared theme variables) so transparent regions are visible, along with its pixel dimensions and generated file size.
- Individual downloads — a dedicated Download button per size, saving conventionally-named files (
favicon-16x16.png,apple-touch-icon.png, etc.) with zero dependencies — no ZIP library, justcanvas.toBlob+<a download>. - "Generate all" — (re)renders every size from the current source in one click; also fires automatically the moment a source image is loaded.
- Non-blocking warnings — a toast (not a hard error) if the source isn't square or is smaller than 512×512; generation proceeds either way.
manifest.jsonsnippet — a valid, pretty-printed web app manifest with an editable app name, aniconsarray covering every generated size,theme_color,background_color, anddisplay: "standalone". One-click copy.<head>HTML snippet — correct<link rel="icon">tags per size,<link rel="apple-touch-icon">,<link rel="manifest">, and a<meta name="theme-color">tag. One-click copy.- Clear / reset — wipes the loaded image and all generated previews to start over.
- Dark & light themes, glassmorphism panels, fully responsive down to 360px, and keyboard accessible.
No dependencies, no build step.
git clone https://github.com/kasapdev/favicon-generator-pro.git
cd favicon-generator-proThen simply open index.html in any modern browser (double-click it, or file:// it). That's it.
- Drag an image onto the drop zone, or click it to browse for one.
- The image is automatically center-cropped to a square and every favicon size is generated instantly — dimensions, warnings (if the source isn't square or is under 512×512), and file sizes appear right away.
- Review each size's live preview on the checkerboard background, then click Download on any card to save that PNG.
- Click Generate all any time to re-render every size from the current source.
- Edit the App name field to update the
manifest.jsonsnippet live, then use Copy on either the manifest or<head>snippet panel to grab the text. - Paste the
<head>snippet into your site, and upload the downloaded PNGs plus a savedmanifest.jsonalongside your HTML. - Click Clear to reset and start over with a different image.
| Action | Shortcut |
|---|---|
| Upload / choose image | Ctrl/⌘ + O |
| Generate all sizes | Ctrl/⌘ + G |
| Show shortcuts help | ? |
| Close dialog | Esc |
Screenshots coming soon.
- ICO multi-resolution bundling (a single
favicon.icocontaining 16/32/48px layers) - ZIP download of all generated sizes in one click
- Maskable / adaptive icon variants for Android with configurable safe-area padding
- Batch mode — generate favicons for multiple source images in one session
MIT Licensed.