Favicon Generator

A favicon is the small icon shown in a browser tab, bookmark list, and (on some platforms) a phone's home screen shortcut — one of the smallest pieces of visual branding a website has, and one that's genuinely tricky to get right because it needs to look intentional at a huge range of physical sizes. A detailed logo that reads perfectly at 256 pixels can turn into an unrecognisable smudge at 16 pixels, the size a favicon is actually most often seen at, sitting in a crowded row of browser tabs. This is exactly why favicons are traditionally distributed as a set of several fixed sizes rather than one single image scaled on the fly: each size gets its own clean, deliberately-resized version, and the browser or operating system picks whichever one best matches how it's actually going to be displayed, rather than stretching or shrinking a single source image and hoping it holds up. The classic way to deliver every size at once is the `.ico` file format — a container that can hold several images of different resolutions inside one file, with a small directory at the start telling whatever's reading it what sizes are available and where to find each one. This tool generates a modern variant of that container using PNG-compressed image data inside each entry rather than the older raw bitmap format `.ico` was originally built around; every mainstream browser and Windows Explorer today reads PNG-in-ICO correctly, and it produces a meaningfully smaller file than storing six uncompressed bitmaps side by side would. Six sizes are generated because each maps to a genuinely different real-world use: 16×16 and 32×32 are the classic browser-tab and bookmark-bar sizes (32 is effectively the 16px icon shown on a high-density/Retina-style display, where twice the pixels are needed to render the same physical size sharply); 48×48 is used by some desktop shortcuts and older Windows contexts; 64×64 covers a handful of higher-density contexts and app-list views; and 128×128 and 256×256 are large enough for a home-screen icon on a phone or a high-resolution app switcher, where a tiny 16px source would look visibly blurry if simply scaled up. Generating all six from one source image, resized independently rather than derived from each other in a chain, keeps every size looking as sharp as the source image allows at that resolution. Because every genuinely square favicon size assumes a square source image, a non-square upload is automatically center-cropped to a square first — taking the largest possible square from the middle of the image, trimming equally off whichever pair of edges (left/right or top/bottom) is longer, rather than squashing the image into a distorted square shape. This is called out explicitly with the exact crop dimensions used, since it changes what ends up visible at the edges of the final icon versus the original upload — a wide logo with important detail near its far left or right edge, for instance, will have that detail cropped away, and knowing this upfront lets you crop or reframe the source image yourself first if that matters for your particular logo.