iOS tab bar icons are blurry

Question

My tab bar icons appear blurry.

I created the icons using Photoshop, and followed the iOS Human Interface Guidelines when I decided the sizes of each icons.

e.g. icon size: 30x30px png

This only happens with the tab bar. I wonder if this happens because of the resolution of the images or because of programming issues...

Answer 1

You're using icon size 30x30 which I assume is for 1x (iPhone<4). Since iPhone>=4 needs 2x and 3x images so you have to include that also.

Either you use images with naming conventions like

star.png     // 1x = 30x30
[email protected]  // 2x = 60x60
[email protected]  // 3x = 90x90

or you can use image.xcassets and put your 1x, 2x and 3x images there and use it.

Reference Xcode Assets Catalogs

Answer 2

Probably because using a device with the retina screen.

Try about changing the icon's filename to [email protected] like "[email protected]".