0

I downloaded an icon in png format. Now I try to resize it to 20x20 pixels using Photoshop CS5. This causes it to become fuzzy, as shown in Photoshop's navigator. I want to use the smaller image for a website. How can I make the reduced image have the same quality as the original I downloaded?

Here is a screenshot of the photoshop screen. youtube logo of size 20x20

Improve this question
7
  • Try to resize it with Ctrl+T and move left-right-up-down a bit to have more sharp edges. Sub-pixel anti-aliasing is causing blurry edges.
    – Vnovak
    Commented Jul 1, 2014 at 8:30
  • it is not just blurry edges , the whole picture showing in navigator section (at the top right of the screen) at 100% is blurry. Is it natural?
    – Baba Kamdev
    Commented Jul 1, 2014 at 8:36
  • 2
    Please share a screenshot.
    – Vnovak
    Commented Jul 1, 2014 at 8:37
  • yes please share the png icon, i think maybe the final size is to small for the image content …
    – Chris
    Commented Jul 1, 2014 at 8:52
  • 1
    The text / details are just way too small. Either use a different image with simpler details, or use a bigger image.
    – Joonas
    Commented Jul 1, 2014 at 10:02

2 Answers 2

Reset to default
0

Don't trust the Navigator panel, trust your export.

The Navigator panel is just a tool to visually orient yourself in large works at big zooms. It is not meant as a preview of what you're going to see when you export a file.

In your case, the Navigator preview is way larger than the file's actual size. Therefore, Photoshop makes a pixelated, fuzzy preview.

Try and export your file (File > Save for Web...), and check that. It's bound to be crisp.

Improve this answer
1
  • 2
    Just to make this clear for the OP. The 100% in Navigator panel is the document zoom level. The Navigator panel thumbnail fits itself to whatever size the panel is.
    – Joonas
    Commented Jul 1, 2014 at 10:04
-1

How i thought it is just too small for the logo to get sharp edges anymore, i would suggest using a icon font such as Font-Awesome for this small icons!

EDIT:

here is a example of what i mean:

128x128 px

20x20 px

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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