iPhone / iTouch icon generator

Home Upload Image Preview & Download apple-touch-icon usage .ico & favicon usage

Favicons, apple-touch-icons, iphone application icons:
An often overlooked design element which brands your website with an icon are generally called Favicons. The original Favicon was a Windows resource file which includes a 16x16 pixel image. Today, with Vista and Windows 7, the .ico format can display an icon up to 256x256 pixels. The iPhone and iPod touch implementation differs slightly from the normal favicon link tag.

The iPhone application icon generator is a free tool to create iPhone-like favicons, apple-touch-icon png's, and .ico files for use in windows. Upon uploading your image and selecting the icon options, you will be shown a preview of the image as well as a zip file containing the following;

256x256 PNG Graphic with transparent background. (for any use)
60x60 PNG Graphic for use as a apple-touch-icon. (iPhone & iTouch)
An ICO File with transparent background for use as a favicon for your website or to use as a windows icon for anything you desire. (icon sizes up to 256x256 are included in .ico file)
A readme.txt file showing the proper implementation of the favicons for both normal web browsers and the iPhone/iPod Touch browsers.

Choose your button style.

High Gloss

Low Gloss

No Gloss

High Gloss w/ Frame

Low Gloss w/ Frame

No Gloss w/ Frame

Image Manipulation
(square images are not modified)

Pad Image

Crop Image

Background
(if image contains transparency)

click for picker :

Don't display my icon!
*for best results, use an image with a minimum width/height of 256 pixels

Preview & Download Files

Full Size Preview (256x256 32bit PNG with transparency)	iPhone-Style.ico contains:
no data to preview. * Image above is shown with extra padding to emphasize transparency	no data	48x48 32bit BMP 48x48 8bit BMP
		32x32 32bit BMP 32x32 8bit BMP
		16x16 32bit BMP 16x16 8bit BMP
	apple-touch-icon.png file
	no data	60x60 32bit PNG with transparency
	No Download Generated

Recently, with the advent of the iPod Touch, Apple updated thier devices to allow users to add website links to their home screen. Officially called 'WebClip Bookmarks' by Apple, these home screen icons are created by taking a thumbnail screenshot of your current view on that website. Pretty cool, but... Soon enough, they all look the same and you are identifying them by their label text instead of the icon. But Apple has provided web site owners the ability to specify an icon to be used in-place of the screenshot. The implementation is simple. When the iPhone's browser visits a page, it will look for a file in the root of the site called apple-touch-icon.png.

You can also explicity specify which icon should be used when the iPhone's browser visits your site by specifying a 'link' tag in the head portion of the page's html. This implementation is very similiar to the favicon.ico usage. Here is the proper usage of the iPhone /iPod Touch LINK element:

<link rel="apple-touch-icon" href="/custom-icon-name.png"/>

The favicon is a small icon which helps to brand your website visually. The icon will often appear in the browser's title or url. When a visitor bookmarks your site or otherwise creates a shortcut/link to it, your icon will replace the default one used by the browser or os (in case of adding to a windows desktop)

You can use pretty much any web compatible image format to enable this feature and often developers will use a .png for its transparency benefits. The recommended file format is still .ico however and offers some benefits over .png when used in this context. As an .ico file, your windows visitors will have the best integration when linking to your site.

Many browsers will automatically display the icon if you simply have a file named favicon.ico in the root of the website. You can specify a different filename and/or location by using one of the following link elements.

For .ico :

<link rel="icon" type="image/vnd.microsoft.icon" href="/somepath/image.ico"
                                />

For .gif :

<link rel="icon" type="image/gif" href="/somepath/image.gif" />

For .png :

<link rel="icon" type="image/png" href="/somepath/image.png" />

2/9/2010	2/9/2010	2/9/2010	2/9/2010
2/9/2010	2/9/2010	2/9/2010	2/9/2010
2/9/2010	2/9/2010	2/9/2010	2/9/2010
2/9/2010	2/9/2010	2/9/2010	2/9/2010

Share this tool with others!

Comments/Suggestions

From Anonymous:

I created an icon and downloaded the zip file but I didn't see the favicon.ico file to use on my website?
From Greg Lemons:
@Anonymous:
You have two options:
- You could reference the included file 'iPhone-style.ico' in the link elements href attribute or
- You could simply rename iPhone-style.ico to favicon.ico
From Derek:

Hello. I just wanted to say what an amazing tool this is. I run a kids computer science camp out of a local university, and we will be using this page to make icons for games that the kids make!
From Dan Cunningham:

Excellent tool. Thanks very much!
From Bobby Baker:

I LOVE this tool! I use it a lot, it's great! The only thing that I don't particularly like is the fact that when you create an icon, it goes up on the ipod screen for anyone to steal. I think it should be optional (maybe a checkbox) so that people who don't want it there, can say no. Thank you for your time, and thank you for this tool,it's great!
From Greg Lemons:

As suggested by Bobby, I have added a checkbox to 'anonymize' your creations.
From Anonymous:

Icons are a tad smaller than the official Apple ones, and the drop shadow needs to be somewhat more noticeable. Otherwise great tool!
From Seaser:

hey there, this tool is just awesome! easy to use and creates great icons! there's just one thing thats (possibly) missing, an option to create the icon without any gloss at all! well but im not demanding... i like it either way! regards, Seaser
From Anonymous:

nice and simple, worked very well. thanks a lot!
From alvaro:

This is great. Thanks.
From Corey:

This is a great tool. I don't know how I feel about the icon i created still being available for download for others. I think it would be nice to know that my icon is my icon.
From Greg Lemons:

@Corey: Just check the box right next to the upload button to ensure no one can download or see your icon.
From Matthew Dunn:

Thanks! Sorry for all the uploads tho! Lots of options!!! =D
From tolga:

Many thanks. Nice service.
From Brady:

Thanks for creating this wonderful FREE tool! I was able to use it 1005 in Firefox and will display the icon on my iPhone version of my site at http://BradySmith.me
From Luna:

This is too cool. Nice work! Thanks!
From Andy:

Great tool.
From Nice guy:

Put some Adsense Ad and earn much money its a very very awsome web tool congrats !!1 put this on ur curriculum
From justthreegs:

Very cool. Thanks!!
From Levin:

wow just great... no need to photoshop anymore :)
From Casey:

I love this. Thanks so much. It was so easy. I used it on my blog TheJourneyIsOurGoal. Can't wait to see what else you come up with. I am definitely telling my blogging friends about this.
From Twincascos:

Thanx so much for this tool. It works great! Congratulations flavorstudio
From wcasado:

Thanks, nice tool. It works great!!!.
From Eddie J:

Great Tool
From shalako:

Great tool, thanks! I downloaded the zip but only the 256x256 version of the ico was included; 16x16, 32x32, or 48x48 versions are missing. Also, a 60x60 and 256x256 version of the apple-touch-icon.png were included. Should both be uploaded or do I choose? Thanks again.
From crc:

Its a bit ironic that this website doesn't itself use a favicon!
From Greg Lemons:

@shalako, The different sizes are embedded into the .ico file. When using newer versions of windows (vista,7) you can resize your icon previews. Those previews come from the embedded image sizes.
From Greg Lemons:

@crc, Heh, good call. JAS
From Anonymous:

you should make this thing a small downloadable app to. I think that would be cool
From sadf:

very good but PNG Size is small!
From Lorenz:

GooDD
From clink283:

Totally sweet. I'm going to use this for all my LabVIEW deployment icons. Thanks for keeping this free.
From Mike Eggleston:

This had to have made my icon creation so simple, and so dirt easy. This is an awesome app!!
From billionairebb:

This is a great app!! Thanks so much for creating this. www.housemusicchannel.com
From Jarod:

This is great tool! Anyway to also have it output a 512x512 icon for the app store?
From Marco:

Bellissimo sito!!
From iantoine:

nice
From KP:

Very useful..Thank you!
From pinkyjong:

cool, it works perfectly. Thanks for this tool.
From wi:

thanks
From Peter Alawin:

Excellent ... Very, very nice ! Thx from France Peter Alawin ... ;-)
From zoso:

i would like more width and height because in my ipod are very small the icons
From Niraj:

I cannot use the tool. It doesn't appear in the site. How to do?
From Carsten Braun:

Best Tool, I had seen in the Web. (Sorry for the bad English writing)
From Mark:

Thanks for providing this very valuable tool.
From simbeb:

Fantastic. I've been creating icons frantically for the last 2 days! The times of painful icon creation in the Gimp are over. Respect.
From redline:

It´s great. Thanks.
From Fred:

Very cool, but not working with the WordPress Touch plugin from the boys at Bright Cove who sent me over here. This looks like a prob on their end, alas, they cannot be found. If you see them, give a nudge. Thanks, your site is great!
From Lucas Sá:

I found the site very good to create the icons, only that when he put in the iPod is smaller than the others. Perhaps you could solve it?
From minkyung:

Nice tool. Thanks.
From Mick:

Amazing tool a must have! Thanks so much!
From Dave:

Great tool! I've noticed one problem, though. Firefox (I'm using 3.5.6 on OS X) displays the .ico files as 16x32 for some reason. This means that in the address bar, the image looks squashed into half its normal size. For me, this occurs on your site as well as mine. Safari and IE seem to have no problems. Any idea what might be causing this?
From Staz:

Thank you so much for the generator and for making it free. It's fantastic!
From Keef:

I have the same issue as Dave (above) - favicon appears half height.
From Urda:

Having the SAME ISSUES AS DAVE! HELP
From businesssprouts:

this is awesome thanks so much
From Alberto Lourenço:

Parabéns!!! Muito útil o serviço!! Obrigadoo!!
From Oscar:

Thank you... This is the best
From EL:

This is the website i have always been looking for but can you make this iphone friendly website or even a free app that generates these and saves them in camera roll
From yourgreenability.com:

Thank you for a great Free Resource. This has saved me a lot of time making a favicon for my website. I will definetly put a link to your site on my blog http://yourgreenability.com to help spread the word. Thanks again
From bernjie:

AWESOME!!!! THE BEST IPHONE ICON I'VE EVER USED!!! THANKS A LOT!!!
From harryhotman:

Great little tool so simple tp use wow many thanks i will ad the link to my site for sure. just one Q please how and where can i add the icon on my iphone i have ssh please advice thanks
From Mark:

I'm having the same problem as Dave. My site (fadedblood.org) has a favicon that looks great in safari and IE, but is smashed in Firefox. Any help?
From Carl:

Cool tool, many thanks. Dont know if it's been mentioned but if you name the icon "apple-touch-icon-precomposed.png" it stops your iphone adding a gloss to it. Thanks again Carl
From David:

Do i use ico or png for iphone icons?
From Greg Lemons:

I would use the png for both favicon and apple-touch-icon right now since there is an issue with the ico's getting squashed on firefox 3.5.6. Refer to the documents included in the zip file for information on how to set them up.
From You broke it again :(:

The form is broken again. Every upload finishes, then pops up a dialog: "404 - File or directory not found." :(
From jakez:

Is there something wrong with your great tool? Every upload "finished" with no response from your site :(
From AffiliateMarketingHomestead:

I have just used it and it is working fine. Downloaded my icons and I am happy
From Anonymous:

How can I find the icones created before?
From Thameem:

Great tool to work, really awesome :-) Need more color pickers for maximum utilization
From Anonymous:

Cool free tool. Upload does not work with my Firefox 2.0.0.13 but with my IE. Direct download of *png (for difference pixel sizes) would be nice.
From EASTeam:

One word: WOW!!! 2 more: THANK YOU!
From GeoffT:

Great tool. I have been using it to "Iphone-ise" all of my pronto remote control icons. Is there anyway it can be made available to download as a standalone program? Now that I have standardised on using this icon style, I would hate to be without it.
From djcproject:

wow!! thanks guys!! this by far the best web side out there!! can't believe it!! thanks again!
From FOR WEBMASTER:

you can put the resolution 50x50? When I put the 48x48 icon in my iphone is perceived that is smaller than the others. You can add this option?
From Greg Lemons:

@For Webmaster The dimensions of the apple-touch-icon is 60x60. You get a large version included that is 256x256. Resize it to whatever you need!
From Bobby Woods:

very nice work.
From celal:

tres bon travaille
From Brianleung:

No work to upload photo from my PC
From Anonymous:

after about 5 times it quit working for me. and i have quite a few icons to do..
From satansarse:

this site is the coolest

Any suggestions or comments are appreciated

Name/Alias:		- This is not a required field.
Email:		- Not displayed but required if you want a response.
Comment/Suggestion	Submit Comment