Overview
The favicon is the hardest-working sixteen pixels on the web: it identifies your site in crowded tab bars, bookmark lists and phone home screens, doing branding work wildly out of proportion to its size. Yet plenty of sites ship without one, or with a blurry afterthought. This generator makes the proper set in about a minute.
Two paths lead there. Upload any image and the tool centre-crops it to a square, then renders the four sizes browsers actually request. Or skip artwork entirely: letter mode sets one bold character on a solid background — a look that stays legible at tab size and suits countless small sites and side projects.
What is a favicon, and why four sizes?
A favicon (favourite icon) is the small image browsers show for a website: in the tab, the address bar, bookmarks, history and shortcuts. The convention dates to 1999, when Internet Explorer looked for a file literally named favicon.ico at the domain root. Modern practice uses PNG files declared with link tags, in the handful of sizes each platform requests.
Size matters because browsers will not politely scale for you — a 180-pixel image crammed into a 16-pixel tab turns to mush. Generating each size at its true pixel dimensions, and previewing them at actual size, is the difference between a crisp mark and a smudge.
Features
- Two starting points — upload any image, or use letter mode with no artwork at all.
- Smart centre-crop — wide or tall pictures become squares automatically.
- Four true sizes — 16, 32 and 48-pixel PNGs plus the 180-pixel Apple touch icon, at exact pixel dimensions.
- Letter mode — one character with your background and letter colours, legible even at 16 pixels.
- True-size previews — see every icon at its actual rendered size before downloading.
- Flexible downloads — grab all four at once, or one by one as needed.
- Made on your machine — all drawing happens locally; your artwork is never uploaded.
Benefits
- Real sizes, not guesses. The four sizes browsers and phones actually request.
- No design software needed. A letter and two colours can carry a whole brand.
- True-size previews. Judge legibility at 16 pixels before you commit.
- Private by design. Your logo artwork never leaves your machine.
Who can use it
Anyone launching a website, from weekend side projects to client work — a missing favicon is one of the most visible signs of an unfinished site. Bloggers, shop owners and developers use letter mode for a fast professional mark; designers use image mode to convert finished logo artwork. If your tabs currently show a generic globe, this page is for you.
How to use
- Choose “An image” and upload your logo or photo, or choose “A letter” and pick a character and colours.
- For images, the tool centre-crops to a square automatically.
- Inspect the true-size previews — especially the 16-pixel one — and adjust if needed.
- Download all four sizes at once, or individually.
- Place the files with your site and reference them with standard link tags.
Frequently asked questions
Why these four sizes?
Because browsers and devices ask for specific files: 16 and 32 pixels for tabs, 48 for some desktop shortcuts, and 180 for Apple's touch icon when someone saves your site to their home screen. Shipping exactly these four covers essentially everything without the bloat of a dozen legacy sizes.
What is the Apple touch icon for?
The 180-pixel apple-touch-icon is what iOS uses when a visitor adds your site to their home screen. Without it, Apple falls back to an ugly screenshot thumbnail. It costs one extra file — always include it.
My logo is wide — will it work?
Centre-crop to a square happens automatically, so wide or tall images become usable icons. But tiny text and fine detail will not survive 16 pixels — if your logo is intricate, letter mode (one bold character on a solid colour) usually reads better at tab size.
Do the files work with any website builder?
Yes. The files are standard PNGs with the conventional names browsers expect. Drop them next to your HTML, add the tags (any favicon guide shows the snippet), and every browser from the last decade will pick them up. No build step, no plugin.
Should I still make a .ico file?
The classic ICO container holding multiple sizes is a legacy format from the Internet Explorer era. Modern browsers happily accept PNGs, which are smaller and simpler. Unless you specifically support IE11, PNGs are the current best practice.
Is my uploaded image sent to a server?
No. All drawing happens with the canvas API inside your browser; your image is never uploaded anywhere. This matters for unreleased logos and client work — generate freely without leaking artwork.
Conclusion
The favicon is the smallest canvas with the biggest job: your brand, legible at sixteen pixels, in every tab and bookmark bar. Start from artwork or a single letter, check the true-size previews, and ship all four sizes — it takes about a minute.