Five different 'screen sizes', one honest answer
Ask 'what is my screen size?' and you have actually asked five questions. There is the physical panel — the diagonal inches on the box. There is the screen resolution in hardware pixels — the grid the display can truly light up. There is the CSS or logical resolution, the smaller, friendlier number websites are laid out against. There is the window size, and inside it the viewport — the rectangle your page actually gets, after browser chrome, scrollbars and split-screen have taken their shares. ScreenScope reports all of them live, because each one is the 'right' answer for a different person: the shopper wants inches, the designer wants the viewport, the developer wants the pixel ratio, and support wants the whole card at once.
Confusion between these numbers causes real-world friction daily. A user reports a site 'broken on my 1920 screen' while the developer tests a 1920 viewport — but the user's browser, docked at half a 4K panel with 200 percent scaling, offered the site barely 960 CSS pixels. Nobody was lying; everybody was measuring something different. The fix is a shared readout, which is what this page is for.
Device pixel ratio: the multiplier that explains modern screens
Modern displays pack far more hardware pixels than layout pixels. The device pixel ratio (DPR) is the exchange rate: a DPR of 2 means each CSS pixel is painted on a 2×2 block of physical pixels; a DPR of 3, common on flagship phones, means nine physical pixels serve one layout pixel. This is why a phone can claim a 1170×2532 panel yet present a 390×844 viewport — and why images prepared at exactly viewport size look soft on modern screens. Designers export at 2× or 3× precisely to feed this multiplier.
ScreenScope shows your DPR prominently because it silently governs so much: whether text looks print-sharp, why a 'small' screenshot file is enormous, and how games and canvas apps should size their drawing surfaces. If you build for the web, the rule that follows is simple — lay out in CSS pixels, render images in physical pixels, and let the ratio mediate between them.
Viewport: the only size your website ever sees
When developers say a design 'breaks at 768', they mean viewport width — the inner rectangle reported here, updating in real time as you drag your window edge or rotate your phone. Try it: resize this window slowly and watch the number chase your cursor. That live rectangle is what media queries respond to, what determines whether a hamburger menu appears, and what a screenshot of 'the site on my screen' actually captures. The gap between screen and viewport — eaten by taskbars, browser toolbars, notches and split-screen — is why two people with identical laptops can see different websites.
Mobile adds a twist worth knowing: phone browsers shrink and grow their toolbars as you scroll, so the viewport height breathes during use. Well-built sites tolerate that breathing; poorly built ones jump and jitter. If a site misbehaves on your phone, the viewport figures on this page — not the model name — are the diagnostically useful facts to report.
Orientation, colour depth and touch: the supporting cast
Orientation sounds trivial until a tablet kiosk, a foldable phone or a car display enters the story: layouts must survive being square-ish, suddenly wide, or rotated by a passenger. ScreenScope reads orientation from the live dimensions, so it stays truthful on devices that defy their category. Colour depth — almost universally 24-bit today, sometimes 30 on HDR panels — tells you how many colours the panel can address; it matters to photographers and video work, and almost never to anyone else, which is itself worth knowing before paying for it.
Touch support completes the practical picture: whether the device accepts touch at all, and how many simultaneous points it tracks. Hover-dependent menus, tiny tap targets and drag gestures are designed against assumptions these numbers expose. When a support agent asks you to open a page like this, they are not stalling — they are reading the six numbers that predict most 'it looks wrong on my screen' reports.
How to use your numbers when buying or building
Buying a monitor? Ignore the inch count until you know the resolution and the scaling your operating system will apply at your viewing distance — a 27-inch 1080p panel and a 27-inch 4K panel share a size and nothing else; text clarity, usable workspace and price diverge completely. Building a site? Design mobile-first against a 360-pixel viewport, verify at the common widths in the comparison table below, and never trust a single device — your own screen is the least representative test environment you own.
The comparison table exists for that humility: it places your live viewport beside the devices your visitors statistically use. If your window is 2560 wide, you are designing from the penthouse; most of your audience is in the 360–430 range, one-handed, on a train. Check the layout there — or drag your window down to that width and watch this page adapt — before believing anything is finished.
A note on what this page cannot see
Privacy-shaped browsers deliberately blur some fingerprints: the user-agent string is increasingly generic, and true physical panel size cannot be derived from web APIs — anyone claiming to read your exact inches is estimating from resolution and typical densities. ScreenScope reports only what your browser truthfully exposes, computes nothing on a server, and stores nothing. The numbers are yours, live, and gone when you close the tab — which is exactly how a diagnostic page should behave.
A quick self-test you can run in ten seconds
Drag your browser window slowly narrower while watching the viewport readout, and the moment the layout of this very page rearranges itself, note the width: you have just found one of its responsive breakpoints with your own hands. Rotate your phone and watch orientation, viewport and screen class flip in unison. Then open this page on the oldest device in the house and compare its card with your main machine's — the two cards, side by side, are a complete lesson in why 'it works on my screen' is the most expensive sentence in software.
Keep the trick for support calls and family tech duty: 'open ScreenScope and read me the second box' replaces ten minutes of 'what phone is it, which version, are you in the app or the browser' with six exact numbers. Diagnosis begins where guessing ends.
Why your two screens disagree
Place a laptop beside an external monitor, mirror this page on both, and the readouts will often differ despite showing 'the same' desktop — different native resolutions, different scaling settings, different physical pixel densities negotiating with one operating system. That disagreement is not a fault; it is the modern display ecosystem working as designed, each panel translating the same logical desktop into its own physical reality. The habit worth building is to describe screens by their numbers, not their marketing names: '2560 wide at 200 percent scaling' predicts what a website will do, while 'the big monitor' predicts nothing. ScreenScope gives every screen you own its true description in one glance.
Frequently Asked Questions
What is my screen size in inches?
Browsers cannot measure physical inches directly. Your resolution and pixel ratio (shown above) identify the panel class — for example, 390×844 CSS pixels at DPR 3 is a modern large iPhone. Check your device settings or model specs for the exact diagonal.
What is the difference between screen resolution and viewport?
Resolution is the whole display; the viewport is the rectangle the web page actually receives, after browser toolbars, scrollbars and split-screen take their share. Websites respond to the viewport — it is the number designers need.
Why is my phone's resolution lower than advertised?
It is not — the phone reports CSS pixels, and the device pixel ratio (often 3) multiplies them into the advertised physical pixels. 390×844 at DPR 3 is a 1170×2532 panel.
What does device pixel ratio (DPR) mean?
How many physical pixels paint one CSS pixel. DPR 2 or 3 makes text and images dramatically sharper, and means images should be supplied at 2–3× their display size to look crisp.
How do I tell support what device I am using?
Use the 'Copy device info card' button — it packages your screen, viewport, pixel ratio, orientation and browser into one paste-able block, which is exactly what support and developers need.
Why do the numbers change when I resize the window?
Because the viewport is live: it is defined by your current window, not your hardware. Dragging the window, rotating the device or toggling split-screen all change it, and this page updates instantly.