Free Favicon Generator

Upload any image and generate all standard favicon sizes as PNG files.

Drag & drop an image here, or click to select

Square images work best (PNG, JPG, SVG)

Favicon Sizes Explained

16×16 · Standard browser tab favicon

32×32 · Retina browser tab, taskbar shortcut

48×48 · Windows site shortcut

180×180 · Apple Touch Icon (iOS home screen)

192×192 · Android Chrome, PWA manifest icon

512×512 · PWA splash screen, Google search

A Brief History of the Favicon

The favicon began life as a Microsoft feature in Internet Explorer 5, released March 1999. Microsoft introduced the convention of looking for /favicon.ico in the site's root and displaying it next to bookmarked sites in the Favorites bar, hence the name "favicon" (favorite icon). The original design choice was the proprietary Windows ICO format, which can hold multiple bitmap sizes in a single file. Other browsers adopted the convention almost immediately and began supporting PNG favicons too, signalled via <link rel="icon"> tags in the document head. Apple's iPhone (launched 2007) added the apple-touch-icon convention, a 180×180 PNG used when users add a website to their iOS home screen, displayed at the same size as a native app icon. Progressive Web Apps (PWA, formalised around 2015) added the manifest.json file with its icons array, requiring 192×192 (Chrome's installation prompt) and 512×512 (PWA splash screens, Android home screens, Windows Start menu pinning) PNG variants. SVG favicons (supported in Firefox since version 41 in 2015, Chrome since version 80 in February 2020, Safari since version 12.1 in 2019) are now the modern recommendation when the icon is a simple shape, one file scales perfectly to any display density. The legacy favicon.ico file is still required for Internet Explorer 11 and older browsers; modern stacks ship the SVG plus a fallback ICO and apple-touch-icon PNG.

Why So Many Sizes?

Each size in the favicon set serves a different rendering context. 16×16 is the classic browser-tab favicon at standard DPI, the size that taught designers how brutal pixel constraints can be. 32×32 is the high-DPI (Retina) browser-tab size; many modern browsers prefer this even for "standard" displays because it scales down better than 16×16 scales up. 48×48 is the size Windows uses for taskbar shortcuts and pinned-site favicons. 180×180 is the apple-touch-icon, displayed when a user adds a site to the iOS home screen. 192×192 is the Chrome web app install prompt and the standard Android home screen icon. 512×512 is the PWA splash-screen icon, Google search result thumbnails, and Windows Start menu tile icons. The reason a single high-resolution file isn't enough: at the smallest sizes, the icon often needs hand-tuned simplification to remain legible (a complex logo at 16×16 becomes a coloured smudge), so professional favicon design typically involves drawing two or three variants, a detailed version for large sizes, a simplified version for medium sizes, and a "mark only" version for the smallest sizes. This generator scales a single source through standard nearest-neighbour-or-bilinear downsampling, which is good for simple shapes; complex logos may need manual touch-up at the smallest sizes.

The HTML That Goes With the Files

Generating the files is half the job; the other half is the meta tags in your <head> that tell browsers which file to use in which context. The 2026 minimum-viable favicon stack:

<link rel="icon" type="image/svg+xml" href="/icon.svg">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

The browser picks the most appropriate file based on the device's pixel density and which formats it supports. Modern browsers prefer the SVG when present; older browsers fall back to the PNG sizes; iOS uses the apple-touch-icon; PWA installation reads the manifest. The favicon.ico at the root is still picked up automatically as a default fallback even without an explicit link tag, every site should still have one for backward compatibility with very old browsers and tooling.

When You Actually Need to Generate Favicons

Designing for the 16×16 Constraint

The 16×16 favicon is the most demanding constraint in modern interface design. 256 pixels (the entire icon canvas) must convey enough brand identity that a user can find your tab among twenty others. Practical guidance from designers who have done this many times: Simplify aggressively. A complex logo at 16×16 is a coloured smudge. Strip detail until only the minimum recognisable shape remains. Maximise contrast against tab backgrounds. Browser tabs are typically light grey or dark grey; an icon with weak contrast disappears into the chrome. Prefer single bold shapes over thin lines. Lines below 2px wide alias to grey at 16px and become invisible. Test at the actual size in your browser. What looks fine in your design tool at 256×256 may be illegible at 16×16. Open multiple tabs of your site and look at them in the tab bar, that's the real test. Consider the dark-mode case. An icon designed for a white tab bar may be invisible on a dark tab bar. SVG favicons can include a prefers-color-scheme media query inside the SVG for automatic light/dark adaptation; for ICO and PNG fallbacks, design something that works on both backgrounds.

What This Generator Produces

Privacy: Browser-Only Image Processing

A logo or branding image you upload to generate a favicon may be confidential, pre-launch brand work, internal-tool branding, NDA-protected client logos. Server-side favicon generators (the very-popular RealFaviconGenerator and similar) take a copy of every uploaded image into their infrastructure where it sits in logs and caches. This generator runs entirely in your browser via the Canvas API: the image is read into the browser, scaled to each favicon size by the browser's built-in image-resizing pipeline, and packaged for download, all in your tab. Verify in DevTools' Network tab while you upload (no requests fire after the page loads), or take the page offline (airplane mode) after it loads and the generator still works on local files. Safe for unannounced brand work, NDA-covered client logos, internal-tool branding or any image you wouldn't want copied onto a stranger's hard drive.

Related Tools

Image Compressor

Compress images up to 80% smaller. Drag & drop, instant download. No upload to any server.

Image Resizer

Resize images to exact pixel dimensions. Presets for social media, web, and more.

Image Converter

Convert between PNG, JPEG, and WebP formats. Batch convert multiple files at once.