Browser Resolution Tester
See your browser window resolution instantly. It shows width, height, and total megapixels, plus a recalculate button for tests. No installs needed.
Your Browser Resolution...
Detecting...
Width is 0 px
Height is 0 px
Total pixels are 0 Million
What this does
So you want the size of your browser window, the actual area a web page has to work with, rather than the whole screen. This shows it. It displays the window's width and height, and the total pixels, the moment you open the page.
How to use it
- Open the page to see your current window width, height, and total pixels.
- Resize the window if you want to test a different size.
- Press Calculate Again to update the figures.
How it works
The tool reads the inner size of your browser window, the part where the page is actually drawn, and shows its width and height. It also multiplies the two together to give the total number of pixels, expressed in millions. Everything is read from the browser on the spot, with nothing sent anywhere.
Window size versus screen size
This is a different measurement from your screen resolution, and the difference matters. Your screen size is fixed, but the browser window is whatever you have dragged it to, and it shrinks further when you open developer tools or a sidebar. This window size, often called the viewport, is what web pages actually respond to.
That makes it genuinely useful for responsive design. If you are testing how a layout behaves at different widths, resize the window and press Calculate Again to read the exact figure, then line it up against your CSS breakpoints to see which one is in effect.
Questions people ask
How is this different from my screen resolution?
Screen resolution is the size of your whole display and does not change. This is the size of your browser window, which changes as you resize it or open panels.
What does the pixels in millions figure mean?
It is the width multiplied by the height, the total number of pixels in the window, written in millions, the same way a camera's megapixels are counted.
Why would I use this for design?
Because responsive layouts react to the window size, not the screen. Resizing and rechecking tells you the exact width your CSS breakpoints are being measured against.
Does it update on its own when I resize?
Press Calculate Again after resizing to refresh the numbers to the current window size.
References
- MDN Web Docs. Window: innerWidth property. https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth
- MDN Web Docs. Viewport concepts. https://developer.mozilla.org/en-US/docs/Web/CSS/Viewport_concepts
Sugam Baskota is a senior software engineer and Computer Science graduate from UT Arlington, with interests in user scripts, browser extensions, developer tooling, and productivity systems. He spends time building practical utilities and extensions in the kinds of workflows Eon is designed to simplify. At Eon Tools, he reviews useful, password, and developer tools.