anybody know anything about icon sets?

what program do you use to convert photoshop files into software ready icons.
What are the color depth requirements for software icons?

thanks

Hi kombi,

This is the Windows .ico format. It's similar to .bmp, but it supports different colour depth and size icons in the same file (e.g. 16x16 with 16 colours, 32x32 with 256 colours, etc). It also supports masks.

I believe you can use a program such as IconForge to convert .bmp's to .ico's.

Hope that helps!

Matt
ELATED : )



--
Matt Doyle, Elated
3rd Edition of my jQuery Mobile book out now! Learn to build mobile web apps. Free sample chapter: http://store.elated.com/

To Matt Doyle:

I believe I have followed the information on page 49-51 of your book on building my own custom Icon but it is still not displaying.

So what I did was use a known working custom icon that is displaying from another jquery mobile application and it does not display either.

All I get is a grey dot where the image should be on the button.

So, there is a problem with the code somewhere...

CSS:
.ui-icon-foodmenu { background-image: url(/images/food.png); }

<a href="index.html" data-role="button" data-icon="foodmenu">Menu</a>

I realized that the file path had one too many backslashes...It was corrected: .ui-icon-foodmenu { background-image: url(images/food.png); }

I took and existing .PNG from http://www.iconfinder.com/ and sized it down to 18 x 18 to use on my button. Since it already has a transparency layer, I took no further action. However the image is not showing properly on the button using the code from the book.

Here is the icon I am attempting to display:
http://www.iconfinder.com/icondetails/49741/128/food_knife_icon

I have discovered that this is not much information on the web of on creating custom icons for Jquery Mobile though I have seen some stunning examples in the Jquery Mobile site.

Can anyone point to where I can find some good information on that topic?

[Edited by ibo765 on 21-Jan-12 20:43]

This has definitely been a learning experience. Since the last post, I have picked up some information from the web that has answered some questions. I have learned how to remove the semi-transparent black/grey circle for the button icon. This allows for more colorful icons to be seen.

Now I need to figure out how to make the button size larger to display more interesting icons. 18x18 pixel dimension is somewhat limiting..

@ibo765: Glad you got it working. You probably don't want to mess about too much with jQM's button/icon sizes though, as it may have knock-on effects with other page elements.

Don't forget you can also create a 36x36 icon for HD displays, which allows you to have more detail.

From a design perspective, it's also worth pointing out that an icon designed at 128x128 won't necessarily be that clear at 16x16! Icon designers usually design alternative icon sets at various different sizes.

Cheers,
Matt

--
Matt Doyle, Elated
3rd Edition of my jQuery Mobile book out now! Learn to build mobile web apps. Free sample chapter: http://store.elated.com/

Inkscape [http://inkscape.org] and IrfanView [http://irfanview.com] can save or convert images to windows icon format (.ico)

[Edited by chrishirst on 10-Feb-12 15:18]

--
Chris.
So long, and thanks for all the fish.
http://webmaster-talk.eu/