Pixels Per Inch Calculator

About Physical and Logical Pixels

Retina is brand used by Apple. It is a marketing term, not scientific definition. Basic idea is still relevant:

Make individual physical pixels small enough so that you don't distinguish them from normal viewing distance.

First Retina product Apple released was iPhone 4 in 2010. First Macs to get Retina display were 15 and 13 inch MacBook Pros in 2012. iMacs got Retina display in 2014 (27-inch) and 2015 (21.5-inch). First external display with Retina screen was Pro Display XDR released in 2019.

Common unit for pixel size is pixels per inch, abbreviated PPI or px/in. Current desktop displays sold by Apple have ~218 physical px/in. Current laptop displays have ~230 px/in. iPhone 12 has 460 px/in. The closer you look at the screen, the smaller you want the pixels to be.

Making physical pixels smaller helps to make nicer images on display. Pixel sizes we are having on desktop displays are not yet small enough to make it irrelevant how the UI is drawn with them. Here we get to scaling and logical resolution.

Apples way of doing Retina on iPhone 4 was to double the displays pixels per inch and then to draw everything twice as big. Software would provide 1x artwork for old screens and 2x artwork for Retina screen helping to display best possible UI on different displays.

On the Mac drawing happens mostly the same way. Difference is that you can choose other scaling options than 2x from Display preferences. If you select other than 1x or 2x the OS draws the picture to bigger virtual canvas and scales it down to fit your screen.

This is where things start to get blurry. On 2x Retina mode 1 logical pixel wide black line is exactly 2 physical pixels wide black line. But on scaled mode that line could be e.g 1.6 physical pixels, meaning that black line is now on top of maybe 3 physical pixels with different shades of gray depending on how antialiasing algorithm works. Effect can be seen here.

So you want to run your monitor in exactly 2x mode to have best possible image quality. If you are creating pictures instead of just watching them then this is even more important.

To have somewhat good physical macOS user interface size you want ~109 logical pixels on desktop monitor. More than 109 means everything is a smaller, less than 109 means everything is bigger. Choose what you like. And to have good image quality you want to have exactly 2x physical pixels per inch, meaning around 218 PPI.

Here is the problem. There arent that many good external displays on the market that have physical 200-240 pixels per inch. Few common values are in the table below. Some of the displays are OK when run in 1x mode and some are OK when scaled. They can be good monitors for your use, but be aware what you are purchasing.

Links

• 2016-12-12 - bjango.com - Mac external displays for designers and developers
• 2017-05-17 - caseyliss.com - Retina Monitors
• apple.com - Using a Retina display

About This Site

This site is made by Mikko Kuokkanen. It has two purposes:

1. Help me learn React framework and Single Page App development.
2. Help me calculate what kind of monitor would be suitable as external monitor for my Mac.