Which favicon sizes do I need?

Common sizes are 16×16 and 32×32 for browser tabs, 180×180 for Apple touch icons, and 192×192 and 512×512 for Android/PWA. This generator creates all of them.

Are my images uploaded anywhere?

No. Every icon is rendered locally on a canvas in your browser, so your source image never leaves your device.

What is the best image to use for a favicon?

Start with a square, high-contrast logo or symbol that stays recognizable when shrunk to 16×16 px. Simple shapes and bold colors read far better at tiny sizes than detailed images or text. A transparent PNG source keeps corners clean.

What format should a favicon be?

The classic .ico format can bundle multiple sizes (16, 32 and 48 px) in one file for broad browser support, while modern sites also supply PNGs and a larger 180×180 px apple-touch-icon for iOS home screens. Providing several sizes ensures sharp icons everywhere.

Why does my favicon look blurry?

Blurriness usually means the browser is scaling one large image down to 16×16 px instead of using a purpose-made small version. Generate dedicated small sizes so each is drawn pixel-perfect, and keep the design simple enough to survive heavy downscaling.

How do I add the favicon to my website?

Place the generated files in your site root and reference them in the HTML head with link rel icon tags for each size, plus an apple-touch-icon link. Browsers also auto-detect favicon.ico in the root for legacy support.

Does a favicon support transparency?

Yes, both .ico and PNG favicons support transparent backgrounds, so your icon blends into light or dark browser tabs. Start from a transparent PNG so the area around your logo stays see-through rather than boxed in a color.

Favicon Generator — Create Favicons

How to use Favicon Generator

Generate a complete favicon package for your website from a single source image — all standard sizes, plus the HTML link tags ready to paste into your <head>. The tool runs entirely in your browser, rasterising your image into every required PNG size and packaging them in a ZIP file alongside a ready-to-use HTML snippet.

Upload a square image (PNG, SVG, or JPEG recommended — at least 512×512 px for best results).
Preview the auto-generated icons at each standard size (16, 32, 48, 180, 192, 512 px).
Optionally apply a background fill colour for sizes that require a non-transparent context.
Click "Generate Favicon Package" to produce all sizes simultaneously.
Download the ZIP file containing all PNG icons and an HTML snippet with the correct <link> tags.
Extract the ZIP, place the icons in your site root, and paste the HTML snippet into your <head>.

Your data never leaves your device — 100% private processing.

Required favicon sizes for all platforms

Modern browsers and operating systems request favicons at different resolutions. A minimal set covers the most important contexts: 16×16 px (browser tab), 32×32 px (browser tab on HiDPI, Windows taskbar shortcut), and 180×180 px (Apple Touch Icon for iOS home screen). Progressive Web App (PWA) manifests require 192×192 px and 512×512 px icons. Legacy browsers used the ICO format, which bundles 16, 32, and 48 px bitmaps in one file. Most modern deployments use PNG icons referenced with specific <link rel> attributes instead.

Favicon size reference by platform
Size (px)	Format	Platform / usage
16×16	PNG or ICO	Browser tab (all browsers)
32×32	PNG or ICO	HiDPI tab, Windows taskbar shortcut
48×48	ICO (embedded)	Windows site shortcut
57×57	PNG	iPhone (legacy iOS < 7)
60×60	PNG	iPhone (legacy iOS 7–8)
72×72	PNG	iPad (legacy iOS)
76×76	PNG	iPad (iOS 7+)
96×96	PNG	Google TV, Chrome Web Store
120×120	PNG	iPhone Retina (iOS 7+)
144×144	PNG	iPad Retina, Windows 8 tile
152×152	PNG	iPad Retina (iOS 7+)
180×180	PNG	iPhone 6+ Retina, Apple Touch Icon
192×192	PNG	Chrome for Android, PWA manifest
512×512	PNG	PWA manifest splash screen, app stores

SVG favicons and the modern approach

Modern browsers (Chrome 80+, Firefox 84+, Safari 15+) support SVG favicons referenced with <link rel="icon" type="image/svg+xml">. An SVG favicon is resolution-independent and scales perfectly at any DPI, including 4K displays. It can also respond to the browser's light/dark mode via the prefers-color-scheme media query inside the SVG, enabling automatic icon switching. For maximum compatibility, combine an SVG favicon with a 32×32 PNG ICO fallback — the SVG is used by modern browsers, the ICO by legacy ones. This approach produces the smallest combined file size.

ICO format internals

The ICO file format (Windows icon) is a container that holds multiple bitmap images at different sizes within a single file. A complete favicon.ico typically contains 16×16, 32×32, and 48×48 px bitmaps. When a browser requests favicon.ico from your site root, it picks the most appropriate resolution for the context. Modern ICO files can also embed PNG-compressed bitmaps (not just raw BMP), which significantly reduces file size. The HTML5 specification allows omitting the <link rel="icon"> tag entirely — browsers fall back to requesting /favicon.ico from the root domain automatically.

Worked examples

Full favicon set

Inputs: 512×512 px source image

Result: 16, 32, 48, 180, 192 & 512 px PNGs + ICO

Apple Touch Icon

Inputs: 512×512 px source image

Result: 180×180 px PNG

Glossary

Favicon: A small icon associated with a website, displayed in browser tabs, bookmarks, and home screen shortcuts.
Apple Touch Icon: The 180×180 px PNG image used as the home screen icon when a user adds a website to their iOS or iPadOS home screen.
PWA manifest: A JSON file (manifest.json or manifest.webmanifest) that defines web app metadata including name, icons (192×192 and 512×512 required), and theme colour.
ICO format: A Windows icon container format that bundles multiple bitmap sizes (16, 32, 48 px) in a single file, used as the legacy browser favicon standard.
Rasterisation: Converting a vector image (SVG) into a pixel grid (bitmap) at a specific resolution.

Related Image Tools

Social Media Image Resizer

Resize images for Instagram, Twitter, Facebook, LinkedIn, YouTube, and TikTok. All the right dimensions in one click. Free online social media image resizer.

Passport & ID Photo Maker

Create passport and ID photos online. Crop to standard sizes (US 2×2", UK/EU 35×45mm) at the right DPI, then download print-ready photos. Free and private.

Resize Image

Resize any image online by pixels or percentage. Free, private, and instant — no upload needed, and the original aspect ratio is preserved.

Convert Image Format

Convert images between PNG, JPG, and WebP instantly. Free, private, and fast — everything runs in your browser and no files are ever uploaded.

SVG ↔ PNG Converter

Convert SVG to PNG at any resolution, or trace a PNG into an embeddable SVG. Free, private SVG/PNG converter that runs entirely in your browser.

Compress Image

Compress JPG, PNG, WebP images online. Reduce file size by up to 90% without visible quality loss. Free, private, runs in your browser.

Explore all Image Tools.

Favicon Generator

How to use Favicon Generator

Required favicon sizes for all platforms

SVG favicons and the modern approach

ICO format internals

Worked examples

Glossary

Related reading

Frequently Asked Questions

Why use Favicon Generator?

Common use cases

Get weekly tool tips & updates

Related Image Tools