Favicon generator
Your logo as the icon in a browser tab, in a bookmark and on a phone's home screen — composed once and written into every size a site is asked for, and the file never leaves your device.
Your file never leaves the device, nothing is stored, and there is no account.
Where it will live
Sigilry
https://sigilry.app
Sigilry — a logo generator that delivers an editable SVG
A short brief in, a finished logo out — one editable SVG whose parts you can still move in Figma. Free favicon and app icon generators.
Sigilry
https://sigilry.app
Sigilry — a logo generator that delivers an editable SVG
A short brief in, a finished logo out — one editable SVG whose parts you can still move in Figma. Free favicon and app icon generators.
What you get
- favicon.ico16, 32, 48 pxthe tab, the bookmark and the search result
- favicon.svgvectorthe same icon as a vector, for the browsers that read one
- apple-touch-icon.png180×180 pxthe icon iOS uses when this page is added to a home screen
- icon-192.png192×192 pxthe small icon an installed web app uses
- icon-512.png512×512 pxthe large one, and the one a mask may crop
- site.webmanifestthe name, the colours and the icon list a browser installs from
- head-snippet.txtthe same tags, as a file to copy from
- README.txtwhat this set is, and what it is not
How it works
- 01
Drop in your logo
PNG, JPEG, WebP or SVG, up to 8 MB. It stays on your device: the file is decoded, composed and encoded in your browser.
- 02
Look at it where it lands
The logo drawn into the places this page is about, at the size each one really uses, with the sentences the tool has about your own file underneath.
What a favicon is, and where it is read
A favicon is the small square a browser draws beside a page's name — in the tab, in a bookmark, in a search result and on a phone's home screen. It is also the one asset a brand owns that is read at 16 pixels, which is why it is composed for those places rather than scaled down to them.
- Browser tab
- favicon.ico16×16
Every open tab carries it, beside the page's title. This is the size the icon is really judged at.
- Bookmarks, and a retina tab
- favicon.ico32×32
The same file, drawn larger: a bookmark bar and a high-density screen ask for this frame, which the .ico carries beside the 16 px one.
- A search result
- favicon.ico48×48
Google draws a site icon beside the result. Its guidance asks for at least 8×8; in practice it wants larger than 48×48, so it has pixels to scale down from.
- A phone's home screen
- apple-touch-icon.png180×180
What iOS saves when somebody adds the page to a home screen from Safari. The rounded square is drawn by iOS; the file itself is a plain square.
- An installed web app
- icon-192.png, icon-512.png192×192, 512×512
The two sizes a browser asks for when the site is installed, listed in site.webmanifest beside the name.
- Any browser that reads a vector
- favicon.svgany size
One file, sharp at every size. Chrome, Edge, Firefox and Safari 26 and later read it, so the .ico is only there for the clients that cannot.
Composed for the square, not shrunk into it
The tool measures where the logo's ink actually is, drops the transparent border it was exported with, and fits what is left into the square inside the margin you chose. Every file in the set is that one composition, so the picture in the preview is the picture each destination gets.
An exported file keeps its own empty border, and scaling the whole frame is what makes a logo arrive small and off-centre in a tab. That is the difference between this and a resizing tool, and it is the whole of what this page does to your logo: it moves nothing inside it and changes no colour.
Put the files at the site root
The tags you paste into <head> point at the root — /favicon.ico, /apple-touch-icon.png — so the files belong beside index.html rather than in assets/ or images/.
A browser that finds nothing at the root draws an empty page glyph in the tab and a generic globe beside a search result, whatever is in a folder somewhere else.
The manifest is a name and an icon list, not an app
site.webmanifest is read when somebody installs the site: the browser takes the name for the home-screen label and the two PNGs for the tile. It carries no start URL and no display mode here, because those turn a name and two squares into a claim that your site is an installable app — and you came for icons.
The colours in it are the ground you chose and the name is the one you typed. Nothing in this set invents a second, shorter name for you.
What this tool does not do. It composes and encodes the logo you give it; it does not redraw it. A logo with hairlines or small type is still soft at 16 pixels, and the sentences under the preview say so rather than patching it over. It writes the web set only: a Safari pinned-tab icon, a Windows tile set and a social image are different destinations with rules of their own.