What is my screen resolution?

How it works

Everything on this page is a property your browser already exposes to any page you open. The viewport comes from innerWidth and innerHeight and updates on every resize. The screen resolution is screen.width by screen.height, which browsers report in CSS pixels, so the physical number is that multiplied by devicePixelRatio, rounded. Zooming the page changes the ratio and everything that depends on it.

The preference rows are media queries the page evaluates for itself: colour scheme, contrast, reduced motion, colour gamut and dynamic range. The graphics rows come from creating a WebGL context and asking it about itself; some browsers hide the real renderer behind a generic name on purpose, and the page says so when they do. Codec rows use canPlayType and MediaSource.isTypeSupported, which answer "probably", "maybe" or nothing. Image rows decode a one-pixel image of each format and see if it works.

Client hints are the newer, tidier replacement for the user agent string. The low-entropy ones are always readable. The high-entropy ones (CPU architecture, device model, full version) are only read when you press the button, because asking for them is the kind of thing a fingerprinting script does and you should get to decide.

Nothing here is sent, logged or stored. The only thing this page records is that it was opened, plus the pixel ratio, colour scheme and whether the device has a touchscreen. Never the user agent, never the renderer, never the report.