Explained: 1x 2x 3x Images In Xcode

By Eddy Chung

1x, 2x or 3x? What does this mean in Xcode?

1x, 2x, 3x Images For Xcode

Which image will be used for your app? That depends on the device your app is viewed on. Higher resolution devices (larger and newer devices) have more pixels on their screens. Thus they need higher resolution images to display properly without any blurring.

If you don’t supply the higher resolution (2x or 3x) images, your app will automatically try to scale the 1x image up. This is not good and can result in a distorted or blurry image!

Here’s a table showing the scale factor for popular iOS devices:

Device Scale Factor
12.9” iPad Pro 2x
11” iPad Pro 2x
10.5” iPad Pro 2x
9.7” iPad 2x
7.9” iPad Mini 2x
iPhone XS Max 3x
iPhone XS 3x
iPhone XR 2x
iPhone X 3x
iPhone 8 Plus 3x
iPhone 8 2x
iPhone 7 Plus 3x
iPhone 7 2x
iPhone 6s Plus 3x
iPhone 6s 2x
iPhone SE 2x

How To Create 1x, 2x, 3x Images For Your App

If you already have your asset but need to scaled correctly for 1x, 2x and 3x in Xcode you can try using one of these services:

Most of these services you input your image and you will get the @2x and @3x images.

How To Create 1x, 2x, 3x In Sketch

If you’re using Sketch to create your assets, simply go to the export panel and click the + icon to add the different scale factors

slider

Then you can export your logo for all the different scale factors.

If you liked this post, you'll love my free guide: Secrets To iOS Development. Speed up your learning curve - hundreds of students have already downloaded. Thanks for reading!
Profile Picture of Eddy Chung

Eddy Chung

I am a professional iOS developer in Silicon Valley. I teach iOS development on ZeroToAppStore.com. If you'd like to learn more about me click here or you can contact me at: eddy@zerotoappstore.com

Similar Posts