Skip to Content

Create custom iPhone and iPod Touch webclip icons

by Dave Caolo Jan 15th 2008 at 11:00PM

Dan Dickinson has posted a super-simple way to ensure that those who visit your site with an iPod Touch or iPhone will get a nice-looking webclip icon. When I say simple, I mean it:
  • Create a 57x57 PNG.
  • Name it "apple-touch-icon.png"
  • Throw it in the root folder of your website. (Not the root of your server, the root of your web documents.)
That's it. Note that your icon will receive the glossy treatment as well as those rounded corners, so keep that in mind.

[Via Daring Fireball]

View Tags

Related Stories

Categories

Macworld iPod Family How-tos Internet Tools iPhone

Dan Dickinson has posted a super-simple way to ensure that those who visit your site with an iPod Touch or iPhone will get a nice-looking...
 

Add a Comment

Sign in »
*0 / 3000 Character Maximum

46 Comments

Filter by:
harlan

it doesn't work on my site!! HELP!

www.theelephantshavingaseizure.com

January 30 2008 at 9:43 PM Report abuse rate up rate down Reply
rish

Why doesn't engadget have one???

January 24 2008 at 11:45 AM Report abuse rate up rate down Reply
laure

HOw do you do this for a blogger/blogspot site?

January 18 2008 at 10:56 PM Report abuse rate up rate down Reply
Chuck Peterson

I found that 120 x 120 looks great with a rounded border.
Need to use specific borders to get it to work right.
Check out http://artistan.org/iPhone/ iPhone icon template for rounded borders.

January 18 2008 at 11:35 AM Report abuse rate up rate down Reply
kingotho

Thanks for the tip. Battlefleet! now has a shiny new icon.

-Roger

January 18 2008 at 4:46 AM Report abuse rate up rate down Reply
Pete Zich

Wow, there's a surprising number of people who have written more simplistic versions of webclip icon changing. Although looking around, looks like I made it first ( :D ). And of course you guys wrote about it first (right after the apple dev page of course, that's my source).

January 17 2008 at 9:47 PM Report abuse rate up rate down Reply
Pete Zich

I made a little webpage to help with using the custom icons I made (and give you the like to my webclip icon previewer). Check it out at: http://pz2.ucls.uchicago.edu/webclipIcons/

January 17 2008 at 8:39 PM Report abuse rate up rate down Reply
basil

ps thanks a lot PZ, good work

January 17 2008 at 11:12 AM Report abuse rate up rate down Reply
basil

meebo
http://img209.imageshack.us/img209/415/meebokz5.png

January 17 2008 at 11:07 AM Report abuse rate up rate down Reply
basil

here are some that i made.. sorry don't have any webspace

digg
http://img140.imageshack.us/img140/6074/diggki6.png

fandango
http://img69.imageshack.us/img69/7509/fandangohs9.png

gmail
http://img184.imageshack.us/img184/1244/gmailhu5.png

January 17 2008 at 11:06 AM Report abuse rate up rate down Reply
Buy an ad here

Hot Apps on TUAW

Tweets

© 2012 AOL Inc. All Rights Reserved.