Tabs · PWAs · touch icons
A favicon generatorthat stays sharp at 16 pixels
Design a tab icon that still reads when it's tiny. The export pack includes browser, PWA and touch icon sizes alongside your app icons.
Start free with 1 creation.
Sixteen pixels
SVG
One vector in the tab for browsers that support it. Keep it simple: a single filled shape scales more reliably than a detailed illustration.
16 and 32
180 touch icon
PWA icons
Sixteen pixels
A favicon is the logo after the detail has been removed
The favicon is the smallest persistent version of a brand: the browser tab, the bookmark, the history row, the installed PWA, sometimes a pinned tab. At 16 × 16 there is room for a silhouette and a color. There is no room for a wordmark, a thin outline, or an illustration with two focal points.
Build it by simplifying the symbol you already have, not by shrinking the full logo and hoping. A bold shape that matches the logo will look intentional. A tiny unreadable name will look broken. Modern browsers can take an SVG; older setups and touch icons still want PNGs at a few fixed sizes.
IconCreator treats the favicon as that simplified glyph: same name, same style as the rest of the mark, drawn so it survives the tab. The resizer can also cut small sizes from a master you upload.
- 01
Start from the symbol
Take the icon, not the horizontal lockup. If the logo is only a wordmark, pick one letter or one geometric piece and redraw it heavier. Do not paste the whole word into a 16-pixel box.
- 02
Thicken it
Strokes that look elegant at logo size become gaps at tab size. Increase weight until the shape is obvious, then stop. Extra interior lines will merge.
- 03
Check the tab, not the zoomed preview
Look at the real 16 and 32 pixel exports on both a light and a dark browser theme. A zoomed-in preview flatters every icon.
- 04
Ship a small set of files
An SVG for modern browsers, PNGs at 16, 32, and a 180 touch icon, and an ICO only if something in your stack still asks for one. The FAQ on this page covers that last conversion.
The file set
What a site actually needs
You rarely need twenty sizes. You need the ones browsers and home screens request.
SVG
One vector in the tab for browsers that support it. Keep it simple: a single filled shape scales more reliably than a detailed illustration.
16 and 32
Classic favicon PNGs. This is the size where a second color or a second shape usually hurts.
180 touch icon
What iOS uses when someone adds the site to their home screen. It can carry a little more detail than the tab icon, and it should still be the same idea.
PWA icons
Installed web apps want larger squares, including a maskable icon with the art inside the safe circle. The resizer builds those from the master.
Favicon questions
What sizes do I need for a favicon?
Common sets include 16×16, 32×32, and larger touch icons (180×180). Start from a clean SVG or 512+ PNG master.
Should a favicon match my logo?
Usually yes — often a simplified glyph from the same family so tabs feel on-brand.
Do you export ICO files?
Export SVG and PNG masters, then convert to ICO with your build tooling if a legacy browser still requires it.
Will fine detail survive?
Probably not at 16px. Prefer bold shapes and high contrast — IconCreator presets lean that way.
How do I start?
Open a studio and describe your app or brand. Your first creation is free, and you can check an icon you already have with the free tools.
