audreyfeldroy / favicon-cheat-sheet

Obsessive cheat sheet to favicon sizes/types. Please contribute! (Note: this may be in flux as I learn new things about favicon best practices.)
MIT License
9.85k stars 413 forks source link

PNG in ICO #9

Open NV opened 10 years ago

NV commented 10 years ago

http://en.wikipedia.org/wiki/ICO_(file_format) states that ICO is a container for BMP and PNG but I couldn’t find any way to make an ICO with PNGs.

The problem with BMP that it does not really support compression.

Have you had any luck making ICOs with PNGs inside?

blackrosezy commented 10 years ago

I have blogged about this few months ago. http://blog.morzproject.com/convert-multiple-png-images-into-a-single-icon-file/

NV commented 10 years ago

It converts PNGs to BMPs. The resulting ico file is >> than all specified PNG files combined.

twm commented 10 years ago

The Ubuntu/Debian package icoutil has an icotool program which does this. It would be nice to know if this part of the format has decent browser (and especially IE) support as they are more convenient than bloating up the markup with a million alternatives.

eliotsykes commented 10 years ago

+1 for the "Icon Slate" app on Mac OSX. Price is £2.99/$4.99 IIRC in the app store. Just select you're creating a favicon and drag and drop the 32x32 and 16x16 into the placeholders.

audreyfeldroy commented 10 years ago

Thanks everyone for the helpful discussion. I've updated the cheat sheet with everything in this thread.

I'll keep this issue open until we get confirmation about @twm's question, about whether ICO files made from PNGs have decent browser support, esp on IE.

twm commented 10 years ago

Android's decoder, at least, doesn't support PNG-in-ICO: https://bugzilla.mozilla.org/show_bug.cgi?id=748100#c10

It looks like Firefox for Android's support is a WIP.

chindraba-work commented 5 years ago

IE-9 does display contents of a favicon.ico file with PNG images.

While this is an ancient post, I thought it was worth getting it closed. It turns out to be rather tricky to actually create a favicon.ico file with pure PNG content. Having finally succeeded with that I created a test page and test site, with that file as the only source of the image. It properly displays in IE-7, IE-8, and IE-9. IE-6 was unable to render it, even when loaded directly. I suspect that IE-6 has no PNG support at all, and an icon file suffers from that. IE-6 and IE-8 were tested in Windows XP and IE-7 while IE-9 were tested in Windows 7.

Results can be seen on imgur.com.