Screen Resolution Test

The screen, the browser window and the physical pixels are three different sizes. This page shows all three and explains how they relate.

Screen

CSS px

Browser viewport

CSS px

Device pixel ratio

Reading the screen size from your browser

Screen resolution

The screen size is the resolution the operating system is using, in CSS pixels after any display scaling. On a scaled display it is smaller than the number of pixels the panel has.

Viewport

The viewport is the part of the browser window that shows the page, without tabs, toolbars or the window frame. Resizing the window or changing the zoom level changes it, while in most browsers the screen size stays the same.

Physical pixels

The physical size shown here is the screen size multiplied by the device pixel ratio and rounded. It is calculated, not read from the display, so it can differ from the panel's native resolution when scaling and browser zoom are combined.

Runs entirely in your browser. Nothing is uploaded or stored.

How to use

  1. Read the screen size, the viewport size and the pixel ratio.
  2. Resize the window or rotate the device and watch the viewport update.
  3. Change the browser zoom and watch the viewport and pixel ratio change. In most browsers the screen size stays the same.

What this test can detect

  • The resolution the operating system is using, in CSS pixels and in estimated physical pixels.
  • The exact size of the area a web page can use.
  • Scaling in the operating system or browser zoom that makes pages look larger or smaller.

Important

  • The physical pixel count is calculated from the pixel ratio and can be rounded. It usually matches the display settings but is not read from the hardware.
  • Browsers may round or limit screen values for privacy.
  • On a multi-monitor setup the values describe the screen the window is on.

Questions

Why is the screen resolution lower than my monitor's native resolution?
Operating system scaling. At 150 percent scaling a 2880 by 1800 display reports 1920 by 1200 CSS pixels with a pixel ratio of 1.5. Multiply the two to get back to the physical resolution.