This section will familiarize you with the latest style of Windows icon design in preparation for creating your own icons.
There are four sizes of Windows icons48 × 48, 32 × 32, 24 × 24, and 16 × 16 pixels.
Microsoft recommends that your icon contains these three sizes:
|
|
![]() Figure 2. General icon sizes |
Icons on the right side of the Start menu are displayed at the 24 × 24 pixels size. This is not a size that you need to provide.
Figure 3. The 24 × 24 size in the Start menu
If you are creating icons for a toolbar, the Windows standard sizes are 24 × 24 and 16 × 16 pixels.
Figure 4. The standard toolbar icon sizes
Windows XP supports 32-bit icons, which are 24-bit images with an 8-bit alpha channel. This allows icons to display with smooth edges that appear to blend into any background.
Each Windows XP icon should contain these three color depths to support different monitor display settings:
|
Figure 5. 32-bit, 8-bit, and 4-bit versions of the My Pictures icon
The following color table illustrates the primary colors used in Windows XP icons. These colors are provided in the first three rows of the mswinxp.pal palette file included with Microangelo.
Figure 6. Windows XP icon color palette
This is the perspective grid that Windows XP style icons use:
Figure 7. Windows XP icon perspective
Not all objects work well at 16 × 16 at an angle. The following objects are usually shown in a straight-on manner:
|
|
Figure 8. Straight-on icon examples |
Create overlapping secondary objects at an angle unless it makes more sense, due to readability and integrity, that they are rendered straight on. Consider also how your icons may be viewed as a set to help determine how to group objects.
Figure 9. Overlapping examples
(Add or Remove Programs, Print
Pictures, Recent Documents)
Windows XP icons use a drop shadow to provide definition and added dimension. This effect is easily added in Studio using the Tools -> Windows XP Effects menu. Select Drop Shadow to instantly create a drop shadow effect precisely to Microsoft's XP icon specifications.
Figure 10. Before and after a drop-shadow is added to an icon
When illustrating XP-style icons, add an outline to the image to provide definition and ensure that the image works well on different background colors.
Home Next |