Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm pretty new to making graphics for a specific platform but not to graphic design in general.

I have a logo I made using Illustrator and had scaled it accordingly by using the Save to Web feature of Illustrator and then added it to a canvas in Fireworks.

In Fireworks the icon looks really crisp, even when I view it in Windows by using the built-in image Preview context menu. Its a square logo sitting at 70x70 pixels.

However, when I add it to my application and I pin it to the metro start menu in Windows, it looks blurry.

What do I need to do to make my image look sharp, crisp, and overall correct on the Windows Metro OS?

share|improve this question
What version of Illustrator do you have? Newer versions have a "Pixel grid" which may come in handy, but older versions are suitable too. – Kromster Dec 20 '13 at 4:56
@KromStern I am using my Adobe Creative Cloud version of it, so its the CC edition. Actually, I found a in Illustrator, I had to export the image at high (300 PPI) quality to a PNG file instead of saving it for the web...then I loaded it into Fireworks. In Fireworks, I used the Image Size button to use bilinear down-scaling of the image to whatever size I wanted it to be, and it came out really crisp! Crisper than saving for web...not sure why. Maybe it has to do with the way Windows Store Apps render images. – Alexandru Dec 20 '13 at 13:57
What about icon fonts? Is that a possibility? – Chris Burton Apr 22 '14 at 14:03

maybe you could make the resolution of the picture the same as the size of the button.

Windows XP:

  • Explorer views:
    • Details / List: 16
    • Icons: 32
    • Tiles / Thumbnails: 48
  • Right-click->Properties / choosing a new icon: 32
  • Quickstart area: 16
  • Desktop: 32

Windows 7:

  • Explorer views:
    • Details / List / Small symbols: 16
    • All other options: 256 (resized, if necessary)
  • Right-click->Properties / choosing a new icon: 32
  • Pinned to taskbar: 32
    • Right-click-menu: 16
  • Desktop:
    • Small symbols: 32
    • Medium symbols: 48
    • Large symbols: 256 (resized, if necessary)
    • Zooming using Ctrl+Mouse wheel: 16, 32, 48, 256

Windows Runtime: (from here)

  • Main tile: 150x150, 310x150 (wide version)
  • Small logo: 30x30
  • Badge (for lockscreen): 24x24, monochromatic
  • Splashscreen: 620x300
  • Store: 50x50

Source: Daniel Rose

share|improve this answer

From the MSDN forum

For a desktop app's icon include the full set of sizes (16x16, 32x32, 48x48, and 256x256) and Windows will choose the most appropriate version. If the right size isn't available then Windows will try to scale a larger one down. If you include only small sizes and Windows has to scale it up then it will end up blurry.

See also:

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.