Resolutions & Displays

In Android, we have density-independent pixels (dp), while in iOS we use point (pt) as the standard unit. The ratio and calculation in iOS is much simpler compare to Android.


Screen Resolutions

Before we dive deeper, here are all the existing devices with its screen resolution.

iOS Device Screen Resolution
Device Display Type Portrait Size (px) Landscape Size (px)
iPhone Lines
iPhone 6+6+, 6S+ Retina HD 1080 x 1920 1920 x1080
iPhone 66, 6S Retina 750 x 1334 1334 x 750
iPhone 5, SE5, 5S, 5C, SE Retina 640 x 1136 1136 x 640
iPhone 44, 4S Retina 640 x 960 960 x 640
iPhone1st, 2nd & 3rd Generation Standard 320 x 480 480 x 320
iPad Lines
iPad Air1st & 2nd Generation Retina 1536 x 2048 2048 x 1536
iPad Retina3rd & 4th Generation Retina 1536 x 2048 2048 x 1536
iPad Pro Retina 2048 x 2732 2732 x 2048
iPad Mini2nd & 3rd Generation Retina 1536 x 2048 2048 x 1536
iPad MiniMini 1st Generation Standard 768 x 1024 1024 x 768
iPad1st & 2nd Generation Standard 768 x 1024 1024 x 768

Points & Pixels Relation

Pixels are the smallest physical element that we can control on a digital display. The more pixels can be fitted into a specific screen size, the higher the PPI (pixels-per-inch), and the clearer the rendered content becomes.

Points are a resolution-independent measurement. Depending on the screens pixel density, a point can contain multiple pixels (e.g., 1 pt contains 2 x 2 pixels on a regular retina display).

When you are designing for various display types, you should think in points, but design in pixels. This means you will still need to export all your assets in 3 different resolutions, no matter in which resolution you are designing your app.


Note

As long as it is not stated otherwise (by appending "px" to a value), this guide always refers to points when it comes to specific dimensions. If you need the value in pixels, just multiply by 2 for Retina screens or by 3 for Retina HD screens.


iOS Device Screen Sizes
Device Assets Resolution PPI Display Size
iPhone Lines
iPhone 6+6+, 6S+ @3x 401 5.5″
iPhone 66, 6S @2x 326 4.7″
iPhone 5, SE5, 5S, 5C, SE @2x 326 4.0″
iPhone 44, 4S @2x 326 3.5″
iPhone1st, 2nd & 3rd Generation @1x 163 3.5″
iPad Lines
iPad Air1st & 2nd Generation @2x 264 9.7″
iPad Retina3rd & 4th Generation @2x 264 9.7″
iPad Pro @2x 264 12.9″
iPad Mini2nd & 3rd Generation @2x 326 7.9″
iPad MiniMini 1st Generation @1x 163 7.9″
iPad1st & 2nd Generation @1x 132 9.7″

Downsampling on Retina HD Device(s)

Rendered pixels and physical pixels are equal on all iOS devices, with one exception: the Retina HD devices, such as iPhone 6 Plus & iPhone 6s Plus (and this list may be extended in near future). Because its screen has a lower pixel resolution than what would be a natural @3x resolution, the rendered content is automatically resized to approximately 87% of the original size (from 2208 x 1242 pixels to fit the display resolution of 1920 x 1080 pixels).

iOS Downsampling