Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It only takes a minute to sign up.
Sign up to join this community
I have icons (in png format) with a resolution of about 500x500 pixels and want to use them in app development around size 30x30 pixels. But when I resize them, they become very aliased.
How can I resize them so they remain crisp, without aliasing or blur? I am using Windows 10. I have GIMP installed, and am happy to use any free software.
For example I have a heart icon
When I scale it down in the app (by setting the width and height programatically), it becomes aliased:
When using bitmap files like PNG, it is always better to have a specialised program handle sizing. Though browsers have been much improved in this regard throughout the years, they are not as heavily optimised as specialised image handling programs such as Photoshop or GIMP.
Photoshop has a batch image resizer, which you can find under File > Scripts > Image processor.
GIMP does not have a handy out-of-the-box tool, but has some options. If you're not afraid of scripting, you can use the Command Line Interface. There are also a few plugins that provide a Use Interface, such as BIMP or David's Batch Processor.
ImageMagick is a command line tool that can handle all kinds of image manipulation, including batch resizing. You can find a tutorial here.
.svgwould be a better file format. — There are some asset managers that can export files in different formats, colors and sizes. On Mac I use iconJar. That said, I get that this is probably not useful information for you in this case, but maybe in the future...