Icon Explosion


This question was posed to me in a comment earlier this week: how many icons does Office contain?


The answer: it depends on how you’re counting.


The most common icon size in Office is 16 pixels high by 16 pixels wide, but we also have 32×32 and a limited set of 24×24 icons in use as well. Additionally, we have a number of graphics used to render the UI which are not icons at all but are either bitmaps (the old way) or PNG files (the new way) which end up compressed into the Office DLLs.


Within each icon, we usually have multiple color depths: 32-bit including alpha channel for the icons you see in the Ribbon, sometimes 256-color versions as well, and definitely 16-color versions for icons that have been around for a while. We also have certain black-and-white variants of icons for use in high contrast mode.


So back to the original question: how many?


The visual nature of the Ribbon, in which every feature has an icon, has meant creating a lot of new icons.


If you just count 16×16 icons (where one icon = one unique shape rendered into any number of color depths within a single .ico file), we have well over 3000.


If you counted each color variant as a separate icon, that number would be much higher.


We’re edging ever closer to 1000 32×32 icons for use in the Ribbon as the days go on…


Suffice it to say, there are a lot of pixels being pushed around.

Comments (21)

  1. This is a nice things. Im working with the rbbon via vsto3 and the image in pgn is a wonderful ideas !!!

  2. It would be really cool to see all those 16×16 icons in one big image, 60 by 50 icons! (How about making a photo mosaic of the office logo using the icons.)

  3. Step says:

    Sjoerd, cool idea.  Wouldn’t be useful, but it would be fun.  🙂

    Though I still have trouble with icons – I prefer words for all but the most frequently used commands.  Maybe that’s because I do too many things in too many different pieces of software….

  4. David Weiss says:

    And these icons are NOT vector graphics right?

  5. ThomThom says:

    ugh! that’s ALOT! Icons take so long to make. Each have to tell a message and be easily identifiable from all the others. …and you got 3000!

  6. So do all of the icons communicate something?  In the context of usability how many icons can a user identify globally within an application?

    Oh, and kudos to the team who can come up with that many icons!

  7. lordhits says:

    How about giving away these icons for users of VS2k5 or something? :). It’ll be a great resource for users developing apps in .NET to use the same icons that are used in MSs flagship apps. Will probably never happen but just a thought……

  8. Dave Solimini says:

    Given that icons are (obviously) visual metaphors, are there times when you have to change icons between international versions because the metaphors don’t work? i would think this especially true when doing non-western internationalization.

  9. john says:

    There is still some trouble with icons. But will try to count them as told by u. May be it will work that way.

  10. Adrian says:

    ::sigh:: I will never understand why, having completely re-written the UI for the OS, AND the Office suite, why, WHY don’t they move to vector graphics for icons? Really, truly, every on-screen UI component should be stored as a vector graphic. This allows users to chose not just screen resolution, but render resolution – so I can run 2048×1536 and have everything be the same size as 1024×768 with twice the clarity, or any size/clarity tradeoff in between.

    MacOS X has vector-based icons, which admittedly do look very nice, but the rest of the UI is still plain old raster images, AFAIK. I just think it’s sad to see perfectly good, easily implementable (with existing libraries) technology go to waste – particularly now that we have the completely open SVG standard hanging around for just this purpose.

  11. Joe says:

    No, Mac OS X icons are NOT vector graphics.  They just happen to be very large (128×128), so they appear to scale very well.  For more info see

    http://arstechnica.com/reviews/1q00/macos-x-gui/macos-x-gui-6.html

  12. Which company is creating your icons? Iconfactory or someone else?

  13. Mike Dimmick says:

    I suspect that with vector icons, you’ll run into the exact same problem that you get with fonts rendered at smaller resolutions: that the bitmaps generated generally look poor, unless adjusted. Good fonts include ‘hints’ – a program of rules which tell the font renderer how to move each line to make a nicer bitmap, so that the text remains readable while still representing the design.

    Shapes that are simple enough to look good at 16×16 are likely to be lacking in detail at 128×128. Similarly if there’s good detail at higher resolutions, there’ll be too much detail at lower ones.

    Would we need hints in vector icons to make them usable?

  14. SeeSunshine says:

    Customization is always a good thing, especially for the frequently used ICONs

  15. Ever wondered how many icons Microsoft is using for office? Well see Jensen Harris’ blog on the Office 2007 UI for the answer:

    http://blogs.msdn.com/jensenh/archive/2006/05/12/596112.aspx

    First of all we are still strugeling with TImagelist with

  16. Could you explain how you go from a feature to an icon? Do you just let the guys design whatever or is there lots of input from the developers?

  17. Lone Shepherd says:

    The vector graphics issue is an interesting one.

    Where does Vista stand with respect to seperating  UI element size from display ppi?  Are there any MSDN blogs discussing those sorts of issues?

  18. Persone los pioneros non rabata. Great…

  19. lesbian rape says:

    Best of all people w can talk…