Over the years we’ve gotten used to referring to our screen designs in pixel measurements, but the pixel has become an outdated term thanks to high-resolution screens. And at the end of the day, it doesn’t really matter if you say “pixels” or “points”, except you will find Apple and others stick to points. So let’s discuss the confusion.

Back when the first iPhone came out, the screen resolution was similar to most computer screens. In those pre-retina days, a pixel equalled a point—they were interchangeable. And as pixels per inch increased on iPhone screens, the resolution only changed when the screen was made larger.

The first three iPhone models had a resolution of 320 x 480 pixels and points, but the iPhone 4 saw the introduction of the retina screen, and a doubling of resolution (but a quadrupling of pixels). Where iPhone, iPhone 3G and 3GS had a PPI of 163, iPhone 4 had a PPI of 326 (double the previous iPhone). At the same time while the resolution in pixels doubled to 640 x 960, the resolution in points stayed the same at 320 x 480. The iPhone 5 heralded a taller screen, and the iPhone 6 widen and lengthen the 5 screen, however the PPI remained the same, even as the resolution in points changed, there were always 4 pixels for every point.

Before Sketch and Figma, mobile app designers had to make a decision early in the design process—work in 2x or double the assets after. This was back before iOS 7 brought us the Jony Ive flat design, saving designers from making gradient buttons and navigation bars exported as PNGs. (Some of us used Illustrator Today when you design in Figma, you do so without reference to the measurement.

So when it comes to referring to measurements in SwiftUI and your iOS app, you’re likely to do so in points without any issue. Almost. There are some elements in iOS that conform to the pixel grid. For example the simple divider used to separate items in a list. And it’s 1 pixel or 1/3 point in height.

Take an iPhone screenshot and import it into Figma. The screenshot will match the device’s pixel resolution, say 1170 x 2532 on a 3x retina screen. Drop a pre-sized iPhone 14 frame on your Figma artboard and you’ll be looking at a frame measuring 390 x 844. And let’s say you’re recreating an old design or matching an app build to the existing design system, you may scale the screenshot down to a third.

Now a days we can supply our developers with assets in PDF format and avoid PNGs altogether. And with various other factors such as Dynamic Type sizing or the placement of system elements, we shouldn’t need to be exact and pixel perfect, at least in the app. In Figma, you might want to make your dividers 0.333 in height in order to avoid having a full point line appearing too light in the app, but beyond a few minor tweaks to the workflow, there’s no need to triple the artboard size or attempt to make your designs pixel perfect when point perfect is unlikely.

What about padding and other fixed sizes?

Apple is happy to tell you the point size of the Type styles available in SwiftUI, but they don’t share too many other dimensions, and they shouldn’t. As the customer can set their preferred text size and our app designs need to be responsive and flexible.