This screen info tool reports the key numbers about your display and browser window in one place: the screen resolution, the current browser viewport size, the device pixel ratio, the colour depth and an estimated refresh rate. Everything is read from the browser and updates as you resize the window, so it is a quick reference whether you are debugging a responsive layout, checking a high-density display, or confirming a monitor is running at the settings you expect.
Screen resolution and viewport size are often confused, and this tool shows both so the difference is clear. The screen resolution is the full size of your display in logical pixels, while the viewport is the area your browser content actually occupies, which is smaller once you account for toolbars and window borders. The device pixel ratio ties them to physical pixels: a value of 1 means one logical pixel equals one physical pixel, while a value of 2 or more indicates a high-density retina-style display where each logical pixel is drawn with several physical ones. Knowing the pixel ratio is essential when you are preparing images or debugging why a layout looks different on a laptop and an external monitor.
The refresh rate estimate is measured by counting animation frames over a short interval using requestAnimationFrame, which gives you a close read of how many times per second your display updates. A common office monitor reports around 60, while gaming and high-end laptop panels report 120, 144 or more. It is an estimate rather than a hardware readout, since the browser does not expose the exact panel specification, but it is a reliable way to confirm that a high-refresh display is actually running at its advertised rate rather than falling back to 60.
Colour depth tells you how many bits per pixel the display is using, which relates to how many distinct colours it can show. All of these values are read locally in your browser and nothing is sent anywhere, so this is a fast, private way to gather the display details you need for bug reports, compatibility checks, or simply satisfying your curiosity about the hardware in front of you.
How this test works
This test reads window.screen for resolution, available area, colour depth and orientation, window.devicePixelRatio for the scaling factor, and the viewport dimensions for the space a page actually gets. The refresh rate is estimated by counting animation frames over a short interval and is labelled as an estimate throughout, because browsers cap frame delivery on battery, in background tabs and under load. Everything here is read once on load and on resize; nothing is stored or sent.
How to use the screen info
- Open the page and the current values are read automatically.
- Compare the screen resolution against the viewport size of your browser window.
- Check the device pixel ratio to see whether you are on a high-density display.
- Watch the estimated refresh rate settle after a moment of measurement.
- Resize the browser window and see the viewport figures update live.
Reference tables
These are server-rendered, so they are readable without running the test and quotable without running any JavaScript. Where a figure comes from a specification it is cited under the table; where it is our own judgement, the table says so.
| What it measures | What it cannot see |
|---|---|
| Report screen resolution, viewport size, device pixel ratio and colour depth as the browser sees them | Report your panel's physical resolution when the OS is scaling or the browser is zoomed |
| Estimate the refresh rate by counting animation frames | Guarantee that estimate: the browser caps frames on battery, in background tabs and under load, so the figure is an estimate and labelled as one |
| Report colour depth as the browser exposes it | Say anything about HDR, colour gamut or bit depth of the panel itself |
Compiled by MyGearCheck from the browser APIs each test uses. Every limit listed here is a limit of the browser, not of your hardware.
| Resolution | Common name | Aspect ratio | Where you meet it |
|---|---|---|---|
| 1280 x 720 | HD, 720p | 16:9 | Older laptops, entry-level TVs, webcam streams |
| 1366 x 768 | WXGA | 16:9 (approximately) | Budget laptop panels |
| 1920 x 1080 | Full HD, 1080p | 16:9 | The most common desktop and laptop resolution |
| 1920 x 1200 | WUXGA | 16:10 | Workstation laptops and productivity monitors |
| 2560 x 1440 | QHD, 1440p | 16:9 | Mainstream gaming monitors |
| 2560 x 1600 | WQXGA | 16:10 | Larger productivity laptops |
| 3440 x 1440 | UWQHD | 21:9 | Ultrawide monitors |
| 3840 x 2160 | 4K UHD | 16:9 | 4K monitors and TVs |
| 5120 x 2880 | 5K | 16:9 | High-density desktop displays |
Resolutions and aspect ratios are arithmetic from the pixel counts. Note what this test reports next to them: on a scaled display, the CSS resolution the browser reports is the physical resolution divided by the device pixel ratio, which is why a 4K laptop often reports 1920 by 1080 with a ratio of 2.
Frequently asked questions
What is the difference between screen resolution and viewport size?
Screen resolution is the full size of your display in logical pixels, while the viewport is the smaller area your browser content occupies after toolbars and borders. This tool shows both so you can see how much of the screen your browser window is actually using.
What does device pixel ratio mean?
Device pixel ratio is how many physical pixels make up one logical pixel. A ratio of 1 is a standard display, while 2 or higher indicates a high-density retina-style screen. It matters when preparing images and when a layout looks sharper or larger on one screen than another.
How accurate is the refresh rate reading?
The refresh rate is estimated by counting animation frames over a short period, so it is a close approximation rather than an exact hardware value. It reliably distinguishes a 60 Hz display from a 120 Hz or 144 Hz one, which is usually what you need to confirm.
Why does my 4K laptop report 1920 by 1080?
Because the operating system is scaling the display, and the browser reports the CSS resolution rather than the physical one. Multiply that figure by the device pixel ratio and you get back to the panel's real pixel count.
Why is the refresh rate not exactly 60 or 144?
Because it is counted from animation frames rather than read from the hardware, and browsers cap frame delivery on battery, in background tabs and under load. The page labels it an estimate for that reason.
Can I copy all the values at once?
Yes. The whole set copies as one block of plain text, which is the form you want when you are pasting it into a support ticket.
Does the colour depth reading tell me if my monitor is HDR?
No. Colour depth here is what the browser exposes about the display buffer, and it says nothing about HDR support, colour gamut or the panel's own bit depth.
Why does the viewport size change when I resize the window?
Because that is what it measures: the area a page actually gets, which is the window minus the browser's own chrome. Screen resolution stays the same because the display has not changed.
Guides for this test
The test shows you what is happening. These explain what to do about it.
More hardware tests
The closest tests to this one are the rest of the system group. Working through a whole machine instead? The full check runs everything in order and ends in one report.
Everything else in the suite: