Which sizes should a favicon.ico or Windows icon contain?
An ICO file holds several pictures of the same icon at different sizes, and whatever shows it picks one; the HTML standard has browsers choose the most appropriate icon from the sizes on offer. For a website favicon, this page starts with 16, 32 and 48 px, small sizes for tabs plus a larger one; Google recommends a favicon larger than 48 × 48 px, which the favicon set below adds as a 192 px PNG. For a Windows app icon, Microsoft says apps should have, at the bare minimum, 16, 24, 32, 48 and 256 px: with the 256 px image, Windows should only ever scale the icon down, never up. Windows looks for an exact size first and otherwise shrinks the next size above, so each size you include is shown pixel-perfect wherever Windows needs that size. The largest image an icon can hold is 256 × 256.
| For | Sizes (px) |
|---|---|
| Website favicon | 16, 32 and 48 |
| Windows app icon | 16, 24, 32, 48 and 256 |
| Every size | 16, 24, 32, 48, 64, 128 and 256 |
Why is my icon blurry at 16 px?
A converter that draws your SVG once, large, and shrinks that picture to each size smears thin lines across neighbouring pixels. This page draws the SVG separately at every size, so at 16 px the browser lays out the vector on a 16-pixel grid. That is as sharp as the artwork allows, but it cannot add detail that is not there: Microsoft’s icon guidance (written for Windows 7) says simply scaling down from 256 × 256 does not work, and that small icons should drop fine details. Check the enlarged 16 and 32 px previews: if a thin outline or small text turns to mush, make a simpler SVG for the small sizes. The previews also show every size on a light and a dark background, because a dark logo on a transparent background can vanish on a dark browser tab.
Can an ICO file contain an SVG?
No. An ICO stores only bitmap images: the original BMP-style pictures, or, since Windows Vista, complete PNG images inside the file. So converting means drawing the SVG as pixels at each size. This page stores every size as a PNG image inside the ICO, which keeps transparency and the file small, and which Windows Vista and later read. Microsoft’s Windows 7-era guidance compressed only the 256 px image, which kept the small sizes readable on Windows XP; an ICO made here does not open on XP or older. The download is named after your SVG; rename it to favicon.ico for a website, or use the favicon set, which names it for you. Starting from a PNG or JPG logo instead? Use the PNG to ICO converter.
SVG favicon or favicon.ico?
Both, ideally. Current Chrome, Edge and Firefox show an SVG favicon, and Safari added SVG icons in Safari 26 (September 2025); older Safari versions do not. Google Search lists BMP, GIF, ICO, PNG, JPEG, PPM and TIFF as its favicon formats, not SVG, and asks for a square icon of at least 8 × 8 px, recommending larger than 48 × 48. And if a page names no icon, the HTML standard lets browsers ask for /favicon.ico on their own. So keep a favicon.ico for those cases and add the SVG for screens that use it.
The favicon set button gives you a ZIP with the favicon.ico, your SVG as icon.svg, PNGs at 180, 192 and 512 px and a site.webmanifest: the 180 px apple-touch-icon.png that Apple’s web content guide describes for the iPhone home screen, and the 192 and 512 px icons that Chromium requires in a web app manifest, listed in the manifest file (add your site’s name to it). Put the files in your site’s root folder and add these lines to the page’s <head>:
<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="icon" href="/icon-192.png" type="image/png" sizes="192x192">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">The sizes value must list only sizes the ICO really holds (the HTML standard says so); the tool writes it from the sizes you ticked.
What can go wrong with the SVG
- Text in another font. An SVG drawn as an image cannot load web fonts, so its
<text>uses a font installed on your device. In a test in Chrome, a font the computer did not have came out in the browser’s default serif. Convert text to outlines (paths) in your design app first. - Missing pictures. Images the SVG links to on other files or websites are not loaded, for security. Chrome then paints a grey broken-image box; this page leaves them out instead and warns you. Embed them in the SVG to keep them.
- No size or viewBox. Without either, a browser draws an SVG in a 300 × 150 box. The converter shows the size it read, and adds a viewBox when there is none so the drawing scales to each icon instead of being cropped.
- Not square. Icons are square. Choose fit (the whole drawing, with transparent bars) or crop (fill the square from the centre).
Why nothing is uploaded
Your browser reads the SVG, draws each size on this page and writes the ICO here, so the file never leaves your device. The SVG is drawn as an image, which in current browsers means any script inside it does not run and it cannot fetch other files.