What Is My Screen Resolution?
See your screen resolution and window size update live as you resize.
This screen resolution checker shows your screen resolution in pixels, the size of your browser window (the viewport), your device pixel ratio, your colour depth and your current orientation. All of it updates live: drag the window smaller or rotate a tablet and the numbers change as you watch. It is the fast way to grab the exact figures for a bug report, a responsive design test, or a support conversation.
The numbers come straight from your browser and device, read with JavaScript. Nothing is sent to a server and nothing is stored, so the readout you see is simply what your own screen reports.
These three figures often get confused, so the tool shows them side by side. Screen resolution is the full pixel size of your display. The viewport is only the visible area your web page can draw into, which is smaller because of browser toolbars and any zoom. Device pixel ratio is how many physical pixels sit behind each CSS pixel, the reason a high-DPI laptop or phone looks sharp.
How to check your screen resolution
- Open the page. Your screen resolution and viewport size appear straight away.
- Read the device pixel ratio, colour depth and orientation below.
- Resize your browser window and watch the viewport figures update live.
- On a phone or tablet, rotate the device to see orientation and sizes change.
- Copy the values you need for your bug report or design test.
Resolution vs viewport vs device pixel ratio
Say a laptop reports a screen resolution of 1920 by 1080 but a viewport of 1200 by 700. The gap is the browser chrome, the operating system taskbar and any page zoom, all of which eat into the space your page actually gets. When you build a responsive layout, the viewport is the number that decides which breakpoint applies, not the screen resolution.
Device pixel ratio explains why a phone that advertises a huge pixel count still lays out like a much smaller screen. A ratio of 2 means each CSS pixel is drawn with a 2 by 2 block of physical pixels, giving crisp text without shrinking everything. Colour depth, usually 24-bit, tells you how many colours the display can show, and orientation flips between portrait and landscape as you rotate a device.
What each value on the page means
Screen resolution is reported as width by height in CSS pixels for your whole display. Viewport is the width and height of the area your web content can actually use inside the current window. Device pixel ratio is the multiplier between CSS pixels and physical pixels. Colour depth is the number of bits used per pixel for colour, and orientation states whether the shorter or longer edge is currently horizontal.
Seen together, these describe both the canvas your display offers and the smaller slice a web page is handed at this moment. That distinction is the whole point of the tool: people usually say 'screen resolution' when the number that governs how a site looks to them is really the viewport, so showing both prevents the most common misunderstanding in one glance.
CSS pixels versus your panel's native resolution
Here is the honesty most checkers skip: the browser reports values in CSS pixels, which are a software abstraction, not necessarily the physical pixel grid of your panel. On a high-DPI display the browser deliberately reports a smaller 'logical' resolution and pairs it with a device pixel ratio above 1, so a laptop whose panel is physically 2560 by 1600 may report 1280 by 800 at a ratio of 2. Multiply the reported size by the pixel ratio to estimate the physical grid.
Operating-system display scaling adds another layer. If you set Windows or macOS to scale the interface, the CSS resolution the browser reports reflects that scaled setting rather than the panel's true maximum. So the figure here answers 'what does the browser see', which is what matters for web layout, and it can legitimately differ from the native resolution printed on your monitor's spec sheet.
When these numbers are useful
For responsive web development this tool is a quick reality check. You can drag the window and watch exactly where your CSS breakpoints fire, confirm that a media query is triggering at the viewport width you intended, and grab the precise dimensions at which a layout starts to break. Doing it in a real browser catches things a fixed emulator preset can miss.
It is just as valuable in support and bug reports. A visual glitch that only appears at a certain window size or pixel ratio is far easier to reproduce when the reporter includes their viewport, resolution and device pixel ratio. Rather than describing a screen in words, a user can copy the exact figures, giving the developer a setup they can match immediately.
Interpreting pixel ratio and breakpoints
A common trap is assuming a device with a large advertised pixel count needs a desktop layout. It usually does not: a phone might have millions of physical pixels but present a viewport only a few hundred CSS pixels wide, because the high pixel ratio is spent on sharpness, not on extra layout space. Always design against the viewport width, and let the pixel ratio take care of image crispness separately.
That also guides how you serve images. On a display reporting a device pixel ratio of 2 or 3, a standard-resolution image can look soft, which is why responsive images offer higher-resolution variants for high-DPI screens. Reading your own ratio here makes the concept concrete: it is the exact multiplier a site would use to decide whether to send you a sharper asset.
Limits and accuracy
Because the browser exposes CSS pixels shaped by OS scaling and zoom, the reported resolution is not a direct read of your panel's hardware. Page zoom in particular shifts the viewport figures, so if the numbers look off, check that your zoom is at 100 percent. None of this is an error; it is simply the browser reporting the coordinate system it actually uses to lay out pages.
Values can also be rounded or constrained for privacy in some browsers, and multi-monitor setups report the display the window currently sits on rather than the whole desktop. Treat the readout as an accurate description of the browser's current view, which is what web pages respond to, rather than as a definitive hardware specification for your monitor.
Related browser tools
The User Agent checker is the obvious companion, since a browser string plus your screen and viewport dimensions together describe the environment a website adapts to. When a layout misbehaves, providing both is the quickest way for a developer to reproduce exactly what you see, and both tools read purely from the browser without sending anything.
If a display or loading issue turns out to be about your connection rather than your screen, the What Is My IP, IP Address Lookup and DNS Lookup tools cover the network side. Having the full set to hand means you can quickly tell whether a problem lives in your browser, your device or the network path to a site.
Frequently asked questions
Is this screen resolution tool free?
Yes, free with no sign-up and no limits. Open it whenever you need the numbers.
Why is my viewport smaller than my screen resolution?
The viewport is only the area your web page can draw into. Browser toolbars, the OS taskbar and page zoom all reduce it, so it is normally smaller than the full screen resolution.
What is device pixel ratio?
It is how many physical pixels sit behind each CSS pixel. A ratio of 2 or 3, common on modern phones and high-DPI laptops, is what makes text and images look sharp.
Do the numbers update when I resize the window?
Yes. The viewport size, orientation and related values update live as you drag the window or rotate your device, so you can watch breakpoints change in real time.
Is any of this information sent anywhere?
No. Every value is read from your browser and device locally with JavaScript. Nothing is uploaded or stored, so the tool is safe to use anywhere.
Does it work on phones and tablets?
Yes. It works in any modern mobile browser and is genuinely useful there, since you can rotate the device and watch the resolution, viewport and orientation change.