Favicon Generator
Generate the full favicon set — ICO, PNGs at every size, apple-touch-icon, and PWA manifest — from a single image. Runs in your browser, no upload.
Drop a square PNG, JPEG, WebP, or SVG here.
Oron your computer. 512×512 PNG is ideal — non-square images are center-cropped.
Generated in your browser.
Every size is rendered via the Canvas API on your device. The favicon.ico binary is built in JavaScript with PNG-embedded entries (supported by every browser and Windows Vista+).
How to use it
- 1Drop a square image (PNG, JPEG, WebP, or SVG) — 512×512 PNG is ideal. Non-square images are center-cropped automatically.
- 2Optionally set a background color, or leave it transparent. Transparent PNGs look great on light and dark UI alike.
- 3Previews appear instantly with every standard favicon size: 16, 32, 48, 64, 96, 128, 192, 256, 512.
- 4Click Download bundle (.zip) to grab favicon.ico (multi-resolution), every PNG size, apple-touch-icon, android-chrome icons, a site.webmanifest stub, and a README.html with the meta tags to drop into <head>.
Common use cases
- Spin up the full favicon set for a new project from a logo or app icon.
- Refresh the favicons on an existing site after a brand update without finding a desktop editor.
- Generate the PWA manifest icons (192 and 512) needed for Add to Home Screen.
- Produce the apple-touch-icon at the right size (180×180) so iOS doesn't fall back to a tiny pixelated version.
- Replace the default Next.js / Vite favicon during dev setup in under a minute.
Frequently asked questions
- Is my image uploaded anywhere?
- No. Every conversion happens in your browser using the Canvas API. The ZIP is built locally with JSZip. Nothing is sent to a server — safe for brand assets under NDA.
- What sizes does the bundle include?
- favicon.ico (16/32/48 multi-resolution), favicon-16x16/32x32/48x48/64x64/96x96/128x128/256x256.png, android-chrome-192x192.png, android-chrome-512x512.png, apple-touch-icon.png (180×180), plus site.webmanifest and a README.html with the link tags ready to paste into <head>.
- How is the .ico file built?
- The tool generates a real ICO binary in JavaScript with PNG-embedded entries — the format Microsoft has supported since Windows Vista, and every modern browser handles. PNG embedding means no quality loss at small sizes.
- Does the source have to be square?
- Square is best — non-square images are center-cropped to the largest possible square so the icon doesn't get squished. If important detail sits near the edges of a wide image, crop to square in a desktop editor first.
- What's the difference between favicon.ico, apple-touch-icon, and the Android Chrome icons?
- favicon.ico is the legacy multi-size icon for browser tabs and bookmarks. apple-touch-icon (180×180) is what iOS uses when you save the site to the Home Screen. Android Chrome uses the 192 and 512 PNGs referenced from the webmanifest. Modern setups need all three to cover every platform.
- Why doesn't the transparent option show a checkerboard preview?
- The preview tiles sit on a white card so transparent icons look like solid white. Open the downloaded PNG in any image viewer to see the actual transparency.
Try next
Meta Tag & OG Preview Generator
Generate and preview Open Graph, X Card, and standard HTML meta tags for your web pages — instantly in your browser.
SVG to PNG / JPEG / WebP
Convert SVG to PNG, JPEG, or WebP at any size — quality slider, transparent or colored background, copy to clipboard. Free, in your browser.
Image Converter
Convert PNG, JPG, WebP, and AVIF images in your browser — no upload, no signup, batch support.