Six PNGs, no converter farm
Use this when you already have a mark and you need the boring favicon set: 16, 32, 48, 180, 192, and 512 pixels, all PNG, drawn on a canvas in this tab. Pick a square-ish PNG or JPG. Each size gets its own download. Typical wiring: 32 as rel=icon, 180 as Apple touch, 192 and 512 in a PWA manifest. ICO packaging is optional. Modern browsers accept PNG favicons. I do not emit a .ico. If a 2009 intranet still demands one, convert those PNGs offline.
The unique failure is feeding a wide wordmark into a square hole. This page stretches to fill. A 400×200 lockup becomes a squashed 32×32 smear. Crop to a square first, or draw a mark that was meant to live at 16 pixels. Thin 1px strokes in a 1024×1024 Figma export look crisp at 512 and vanish at 16. That is not a canvas bug. That is 16 pixels.
Worked example: a 1024×1024 square logo
Upload it. You get six PNGs. 512 and 192 are the PWA pair (see a site.webmanifest icons list). 180 is the Apple touch size people still hardcode as apple-touch-icon. 48 is the leftover Windows tile-ish size. 32 is what most desktop tabs actually show. 16 is the favicon.ico era, still requested by older bookmarks. If the 16×16 is a blur, simplify the mark: fewer cuts, thicker strokes, no 8-point type. Re-export from Figma at 1024, crop, run this again. Pair with the image compressor if the source is a 12 MB PNG and you only needed 512.
Worked example: 400×200 wordmark, uncropped
The canvas is square at every size. drawImage maps the full image onto that square, so 400×200 becomes a 32×32 pancake. Letters that were 18px tall in the source are a few pixels here. Fix: crop a square around the symbol, not the whole wordmark, then upload. If the brand insists the full name appears in the tab, accept that 16×16 cannot hold it and use a single letter or a symbol at small sizes. This generator will not letterbox, will not add padding, and will not invent a “safe zone.”
Worked example: transparency and dark tabs
A PNG with a transparent background on a light-gray page looks fine. In a dark browser chrome, a black mark on transparent becomes a hole. This tool does not emit a dark-mode pair. If you need two marks, run twice with two sources. Semi-transparent anti-aliased edges against a checkerboard in Figma can pick up fringes when drawn onto a clear canvas; flatten on the paper color you actually use if the fringe bothers you. ICO is still optional: link PNG in HTML. Do not upload the logo to a random “favicon generator” that keeps the file. That is the farm this page exists to skip.
What this will not emit
No .ico container, no SVG favicon, no maskable-icon padding, no automatic 32×32 with a 16×16 baked into one ICO. SVG is a different link rel=icon if your mark is simple enough to survive as vectors. Maskable PWA icons want extra safe-area padding; these canvases are edge-to-edge. If the file is a 40 MB TIFF, convert to PNG first. If the file is a PDF, this is the wrong tool. Download only the sizes you will actually reference. Six unused 512s in a repo are not a PWA.
Which PNG sizes come out?
16, 32, 48, 180, 192, and 512. Typical mapping: 32 as favicon, 180 for Apple touch, 192 and 512 for a PWA manifest.
Do I get an .ico file?
No. ICO packaging is optional. Modern browsers accept PNG favicons via a rel=icon link with type=image/png. Convert offline only if a prehistoric client still demands .ico.
Why does the 16×16 look muddy?
Thin strokes and small type die at 16 pixels. Start from a square mark drawn for 16, or simplify the 1024px logo before you upload.
My logo is a wide wordmark. Why is it squashed?
Each size is a square canvas. drawImage stretches to fill. Crop to a square first; this page does not letterbox.
What about SVG favicons?
Not emitted here. If you have a simple SVG, you can link it separately. This tool rasterizes to PNG on a canvas.
Does the logo leave this tab?
The file is read into a canvas here. Download the PNGs you need. There is no converter farm on the other end.