Have you ever needed to measure distances in pixel on your Mac? Maybe you need to know how far apart to items are or how long something on the screen is. MacOS makes this very easy using nothing but the already built-in screenshot tool.
You can select a region of the screen by pressing Command + Shift + 4 and then holding the left mouse button pressed while dragging the mouse cursor around on the screen. You can see the pixel size of your selection and use it to measure things on the screen as long as you keep the mouse button pressed.
Release the mouse button to take a screenshot and save it to your desktop. You can dismiss the screenshot/measuring tool without saving a potentially useless screenshot file on your desktop by pressing the Escape key.
There are a bunch of third-party dedicated screen ruler applications. These don’t work in OS X’s full-screen mode, many cause problems with high-resolution Retina screens, and tend to be hard to use as they’ve too many features. These apps are priced at 22 euros on average in the Mac App Store.
Using the method I’ve described will work on any Mac out of the box and free of charge. The screenshot-measuring method also don’t have any of the issues the other apps have.
Getting an even closer look
You can zoom in on a specific area of the screen if you need to take a closer look at something. First, you must enable the Use scroll gesture with modifier keys to zoom option in System Preferences: Accessibility: Zoom.
After enabling the option, you can zoom on your mouse cursor by holding the Control key pressed and scrolling (using the scroll wheel or a finger gesture.) The screenshot/selection tool and the zoom tool together allowing for some high-precision screen measurements.
This is a really neat feature when you need to quickly check if something is vertically and horizontally aligned in your web designs. Graphic design tools probably has something like this built-in already, but it’s neat to be able to use the same method everywhere.
This method isn’t suited for counting the distance between two points on the screen in pixels. There’s a little pixel counter next to the cursor while dragging. However, it can be hard to position it exactly between the two points.
When you need exact measurements, select the region and click to take a screenshot instead of dismissing the tool. The file will be created on your Desktop. Open it in the Preview app where you can drag, select, and then drag again to reposition the selection. This will allow you to do more precise alignments and measurements.
Keep in mind that these rulers will measure in device pixels.