When you want to measure pixels on a screen there isn’t any readily available tool for you in windows that can do the job. I have listed some of the lightweight tools that you can help you to achieve the same.
Why would someone measure pixels on a screen?
When you visit webpages you often find banners, images or windows that grab your attention. If you want to find what size those objects are, then you need to measure its pixels. Web Developers not only check if a website is responsive but also make use of tools like this during their development activity. You can also measure an arbitrary area on the screen with the help of these tools.
You can add the MeasureIt Firefox add-on to help you measure pixels on a screen.
You can add the Page Ruler Chrome Extension to measure pixels on a screen.
Enable the Element Mode (click the <> on the top) to navigate the objects on the page one by one.
A Ruler for Windows
- Download (860 KB) and install the A Ruler for Windows.
- Use the Mouse Scroll to move the ruler up or down and use the left and right arrow keys to move the ruler to your left or right.
- Click the forward slash / in the left bottom of the ruler options box to switch the ruler to horizontal or vertical positions.
- For more shortcuts and how to use the ruler click ‘?’ symbol in the right bottom of the ruler.
- Meazure is a lightweight tool packed with lot of options. Download (2.61 MB) and install the tool.
- Click the Rectangle or Circle and start measuring the pixels of a particular area in your screen.
- Use the Measure a window option to know the size of any window.
- Other measurement units like inches, centimeters, millimeters etc. are also available.
- You also have a built in magnifier to hover on screen areas and get a better look at them.
- Just like color picker you can get the color of a screen pixel using this cool tool.
- Cropper (438 KB) is basically a screen capture tool which can also be used to measure the screen pixels.
- Download, extract the zip contents and run the CropperSetup.msi
- You can set predefined size in cropper and use that on screen.
- When you hit Print Screen key the images are automatically saved to a local directory (C:\Users\\Documents\Cropper Captures) in BMP format. You can also change the output to clipboard or to some other format like JPEG and PNG.
- You can also use the developer tools in Chrome or Firefox to measure the size of an object easily.
- Launch the developer tools (F12)
- Select the magnifier icon (in chrome) or the arrow icon (in Firefox) and click on any object on the webpage.
- In Chrome when you mouse hover on the HTML element in the developer tool window, you can see the size of the object.
- In Firefox you can get the size of the object by navigating to the computed tab on the right pane of the developer tool.
Which tool do you use when you want to measure the size of an object in a webpage?