every app icon and favicon from one logo
add your logo. you get the favicon, the Apple touch icon, the web manifest, and the iPhone, Mac and Android app icons at every size, in one zip, with the tags to paste.
free to useno signupresults straight away
drop, paste or pick a file · it stays on your device
the tags for your <head>
put the files from the web folder at the root of your site, then paste these.
<link rel="icon" href="/favicon.ico" sizes="48x48"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
how it works
- 1
add your logo
drop, paste or pick a picture. a 1024 square or an svg gives the sharpest icons.
- 2
pick a background
app icons can not be see-through, so choose the colour they sit on and the space around the logo.
- 3
download the zip
a folder each for the web, iPhone, Mac and Android, ready to drop in.
what is in the zip
- favicon.ico with 16, 32 and 48 pixel pictures inside
- favicon PNGs at 16 and 32 pixels
- the 180 pixel Apple touch icon for iPhone home screens
- 192 and 512 pixel icons and a maskable icon for the web manifest
- site.webmanifest and the tags for your <head>
- an iPhone AppIcon.appiconset with a 1024 icon and its Contents.json
- a Mac AppIcon.appiconset in Apple's rounded square, at all ten sizes
- Android launcher icons for every mipmap density, and a 512 icon for the Play Console
why your icons are worth ten minutes
the icon is how people find you again
A browser tab, a bookmark, a home screen and a dock all show your icon long after the first visit. In a row of open tabs it is often the only thing that says which one is yours. A blank or default icon is easy to lose; a clear one is found in a glance.
every place wants a different file
Browsers look for favicon.ico and small PNGs. iPhones use the Apple touch icon when someone adds your site to their home screen. Android and installed web apps read a web manifest. Xcode wants an asset catalog with a Contents.json, and the Mac expects its own shape. Making each by hand is slow, and one missing file means a blank square somewhere.
app icons can not be see-through
The App Store does not accept an iPhone app icon with transparency, and Android launchers put a see-through icon on a background of their choosing. That is why this tool puts your logo on a colour you pick for those icons, and keeps the favicon see-through unless you ask otherwise.
Mac icons have their own shape
On a Mac, app icons are drawn as a rounded square with some space around it, so they line up in the dock and in Finder. Apple's template puts an 824 pixel rounded square inside a 1024 canvas. The Mac icons here follow that template, so your app does not look larger or squarer than its neighbours.
small sizes need a simple picture
At 16 pixels there is room for a shape and a colour, not for words. If your logo has a name in it, try just the mark. The preview shows the browser tab size, so you can see what survives before you download anything.
a few quick answers.
Is my logo uploaded?
No. Every icon is drawn in your own browser, and the zip is made there too. The picture is never sent to us or anyone else.
What picture works best?
A square PNG of at least 1024 by 1024 pixels, or an SVG, with a simple mark and little fine detail. Smaller pictures still work, but the large app icons will look soft.
Do I still need favicon.ico?
Most browsers in use read a PNG favicon, but some tools, older browsers and feed readers only ask for /favicon.ico at the root of your site. It is one small file, so the zip includes it.
How do I use the iPhone and Mac icons in Xcode?
Open Assets.xcassets in your project and replace the AppIcon.appiconset folder with the one from the zip, the ios one for iPhone and the macos one for a Mac target. Xcode 14 and later make every iPhone size it needs from the single 1024 icon.
What is a maskable icon?
Android crops installed web app icons into a circle, a squircle or another shape, depending on the phone. A maskable icon keeps the logo inside the middle of the picture, so nothing important is cut off whatever the shape.
ready? launch it on ShipDesk.dev
your own launch page, a link to your site and a full week on the board. free, and it takes about a minute.
launch yours for free