Favicon Generator
Create a letter or emoji favicon and download .ico, 512px and 192px PNG.
How Favicon Generator works
Design a simple favicon from a letter or emoji, then download a multi-size .ico plus PNG versions. Everything happens inside this page: the tool reads your input, runs the calculation or conversion locally, and hands the result back to you. Nothing is transmitted, because there is no backend to transmit it to.
That design choice is deliberate. Most free tool sites upload your files to a server, process them there, and quietly keep a copy. Toolcin cannot do that — the site is a set of static files. If your connection dropped the moment the page finished loading, every tool would still work.
What actually gets written
The icon is drawn on a 512-pixel canvas, then exported as a multi-size .ico plus PNG versions. One file containing several sizes is what browsers prefer — they pick the size that fits the tab, the bookmark bar or the home screen instead of rescaling a single large image.
The .ico container is built in the page; nothing is converted on a server, so the logo you type never leaves your machine.
Letter, colours and shape
Up to three characters fit in the letter field. One character reads best at 16 pixels — the size a browser tab actually uses — because anything longer turns into a smudge at that scale.
Shape matters more than it looks: a rounded square reads as an app icon, a circle reads as a profile badge, and a plain square is the safest when the icon sits on an unknown background. Pick colours with strong contrast against each other; a subtle palette is invisible at 16 px.
| Size | Where it appears |
|---|---|
| 16 × 16 | Browser tab |
| 32 × 32 | Bookmarks, taskbar |
| 180 × 180 | iOS home screen |
| 512 × 512 | Android and PWA install |
Installing it
Drop the files in your site root and reference them with a link tag: an .ico at /favicon.ico is picked up even without a tag, which is why it is worth using that filename. Add an SVG favicon as well if you have one — modern browsers prefer it and it stays sharp at any size.
Browsers cache favicons aggressively. After replacing one, a hard reload or a new private window is usually needed before the change appears.
Good to know
- Works offline once loaded, including on flights and in locked-down networks.
- No file size limit beyond your device's own memory.
- Free to use, with no account and no usage counter.
- Results are produced locally, so they are not logged or shared with anyone.
Questions
Which sizes are inside the .ico?
16, 32 and 48 pixel frames — what browsers and Windows shortcuts expect.
Where do I put the files?
In the site root, then link them with a rel=icon tag in head.
Why does my icon look blurry in the tab?
A single large PNG scaled down to 16 px loses detail. That is why the multi-size .ico exists — it supplies a purpose-drawn small version.
Can I use an image instead of a letter?
Not in this version; the input is a letter, a background colour and a foreground colour.
Keep going
More design tools
Border Radius Generator
Set each corner independently and copy the ready-to-use border-radius CSS.
Open toolColor Contrast Checker
Check the contrast ratio between text and background and see WCAG AA and AAA results.
Open toolColor Picker
Pick the exact colour of any pixel in a photo and read it as HEX, RGB and HSL — useful for matching a brand colour from a screenshot.
Open toolColor Converter
Convert colours between HEX, RGB, HSL and HSV, check contrast ratios and copy ready-to-use CSS values.
Open toolCSS Gradient Generator
Design a gradient with two or three colours, adjust the angle and copy the CSS.
Open toolBox Shadow Generator
Create a box shadow with live preview and copy the exact CSS declaration.
Open tool