Upload a PNG, JPG, or SVG image and generate every standard favicon size — 16×16, 32×32, 48×48, 64×64, 128×128, and 256×256 — right in your browser. Preview each size, download them individually, or grab them all as a ZIP.
Drag and drop a PNG, JPG, or SVG image here, or click below to browse.
A favicon (short for 'favorite icon') is the small square image a browser displays next to a page's title in a tab, in a bookmark list, in browser history, and in several other places across desktop and mobile operating systems. Different display contexts render a favicon at different physical sizes — a browser tab is tiny, a bookmarks bar icon is a bit larger, a 'add to home screen' icon on a phone can be substantially larger still — and a single fixed-size image scaled up or down for every context tends to look soft, blurry, or overly cropped in at least some of them. Providing several purpose-built sizes lets each display context use an image generated specifically for it, producing consistently crisp results everywhere your favicon actually appears.
This tool decodes your uploaded image using the browser's built-in image decoder, determines the largest square region that fits within your image's dimensions, and crops to that centered square region before drawing it onto a canvas at each target size (16, 32, 48, 64, 128, and 256 pixels) using high-quality image smoothing. Centering the crop, rather than stretching the whole image to fit a square, preserves your image's original proportions and avoids the distorted look that non-uniform scaling would produce — the tradeoff is that content near the left/right or top/bottom edges of a non-square source image gets trimmed off, since only the centered square portion survives into the final favicons.
Regardless of whether your source file was a PNG, JPG, or SVG, every generated favicon size is output as a PNG file. PNG is the practical standard for modern favicons because it's a lossless, universally-supported format across every browser and operating system, and because it supports a full alpha transparency channel — useful for logos meant to sit cleanly on a colored browser tab background or a dark theme, without an unwanted opaque background box around them. Re-encoding every source format into consistent PNG output at each size also guarantees predictable, uniform results regardless of what format you originally uploaded.
Once downloaded, favicon files are typically placed in a website's public root directory or a dedicated assets folder, then declared in the page's HTML `<head>` using `<link rel="icon">` tags, one per size you want to explicitly provide — for example, `<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">`. Most sites don't need every single size explicitly declared; providing a couple of representative sizes (commonly a small one like 32×32 and a larger one like 256×256) covers the overwhelming majority of browsers and contexts well, since browsers are generally capable of selecting or scaling appropriately from what's declared. Some platforms and app manifests (like a Progressive Web App's manifest.json, or Apple's specific touch-icon convention) call for additional specific sizes beyond the six this tool generates — check your specific platform's documentation if you're targeting one of those more specialized use cases.
Because a favicon is often displayed at a genuinely tiny size (16×16 pixels is only 256 total pixels), simple, bold, high-contrast designs hold up far better than detailed or subtle ones — a clean letterform, a simple geometric icon, or a recognizable silhouette tends to remain legible at small sizes, while fine detail, subtle gradients, or busy compositions quickly become an indistinct blur once scaled down that far. If you're designing a logo or icon specifically with favicon use in mind, it's worth checking how it looks at the smallest size (16×16) early on, since that's the size where legibility problems show up first and most severely — a design that reads perfectly well at 256×256 can become unrecognizable at 16×16 if its details are too fine or its contrast too subtle.
Favicon Generator produces every standard favicon size from one source image. These related image tools cover other common image preparation tasks.