What is my screen resolution?
What is my screen resolution – and how much space does a web page really get inside the browser window? All values are measured directly in your browser and update live when you resize the window, zoom or rotate your device.
Source: MDN Web Docs – Screen. Updated: .
How it is calculated
There is more than one correct answer to “what is my screen resolution”: the display’s physical pixels, the CSS pixels the browser works with, and the viewport – the area a web page actually gets. This tool shows all of them side by side.
How to find your screen resolution
- Open this page: the resolution in physical pixels and in CSS pixels appears right away.
- Resize the window, zoom or rotate the device – viewport, zoom and breakpoint update live.
- Read the devicePixelRatio, aspect ratio and available area without the taskbar.
Example: A laptop with 1920 × 1080 pixels and 125% Windows scaling reports a devicePixelRatio of 1.25 at 100% browser zoom. In CSS pixels that is 1920 ÷ 1.25 = 1536 and 1080 ÷ 1.25 = 864, i.e. 1536 × 864.
What the values mean
- Physical pixels: screen size in CSS pixels × devicePixelRatio. A Full HD laptop at 125 % scaling reports 1536 × 864 CSS pixels – × 1.25 gives the real 1920 × 1080.
- devicePixelRatio: how many physical pixels make up one CSS pixel. 1 = classic monitor, 2 or 3 = Retina or phone display. Browser zoom and Windows display scaling both change this value.
- Available: the screen minus the taskbar or Dock.
- Viewport: the inner size of the browser window (
innerWidth × innerHeight) – this is what media queries and responsive layouts respond to. The visible area (visual viewport) is smaller on phones when you pinch-zoom or the keyboard is open. - Aspect ratio: reduced exactly (1920 × 1080 = 16:9) and, for odd values, the common name (1366 × 768 ≈ 16:9).
- Breakpoint: which tier of Bootstrap 5 (sm from 576, md from 768, lg from 992, xl from 1200, xxl from 1400 px) and Tailwind CSS (sm from 640, md from 768, lg from 1024, xl from 1280, 2xl from 1536 px) applies at the current window width.
Common resolutions
| Name | Pixels | Ratio |
|---|---|---|
| HD (720p) | 1280 × 720 | 16:9 |
| HD / WXGA | 1366 × 768 | ≈ 16:9 |
| Full HD (1080p) | 1920 × 1080 | 16:9 |
| WUXGA | 1920 × 1200 | 16:10 |
| QHD / WQHD (1440p) | 2560 × 1440 | 16:9 |
| UWQHD | 3440 × 1440 | ≈ 21:9 |
| 4K UHD | 3840 × 2160 | 16:9 |
Limitations
Browsers sometimes round CSS pixels down, so physical pixels can be off by one (2561 instead of 2560). With several monitors, the browser reports the screen the window is currently on. Firefox with fingerprinting protection enabled (resistFingerprinting) may deliberately report standard values.
More browser checks: see your browser and system with what is my user agent, your public address with what is my IP address, and work out image sizes with the aspect ratio calculator.
Frequently asked questions
How do I find out my screen resolution?
Just open this page: the resolution in physical pixels is shown at the top, followed by the values in CSS pixels and the size of your browser window. On Windows you can also find it under Settings → System → Display → Display resolution.
Why does my browser show 1536 × 864 instead of 1920 × 1080?
Because Windows is scaled to 125 % (or browser zoom is not at 100 %). The browser then works in CSS pixels: 1920 ÷ 1.25 = 1536. The physical pixels are shown at the top – they are CSS pixels × devicePixelRatio.
What is the difference between screen resolution and viewport?
The screen resolution is the size of the whole display. The viewport is only the inner area of the browser window, without tab bar, address bar and taskbar. For web design and media queries, the viewport is what counts.
What does a devicePixelRatio of 2 or 3 mean?
Your display is high-density (Retina): one CSS pixel consists of 2 × 2 or 3 × 3 physical pixels. Text and images look sharper, while layouts keep the same size.
Is my data stored?
No. All values are read and displayed only in your browser; nothing is sent or stored.
Sources and legal basis
- MDN Web Docs – Screen
- MDN Web Docs – Window.devicePixelRatio
- MDN Web Docs – Visual Viewport API
- MDN Web Docs – prefers-color-scheme
- Bootstrap 5.3 – Breakpoints
- Tailwind CSS – Responsive design
As of: · Editorial policy
Related tools
- What is my user agent?See your user agent string and detect browser, version, engine, OS and device type, plus User-Agent Client Hints. Parse any other UA too. Runs locally.
- What is my IP address?What is my IP? See your public IPv4 or IPv6 address at once, plus approximate location, internet provider and browser details. Free, never stored.
- Webcam test: check your cameraFree webcam test in your browser: live picture, real resolution, megapixels and frame rate, try every level up to 4K, brightness check, photo. No upload.
- Keyboard test: do all your keys work?Online keyboard tester: every key lights up and stays marked. Find dead keys, ghosting, rollover limits and key chatter – ANSI, ISO, laptop and Mac views. Free.
- IPv4 Subnet Calculator: Network, Broadcast, Host Range and SubnettingIPv4 subnet calculator with CIDR: network address, broadcast, usable host range, subnet mask, wildcard and host count – binary working and subnetting.
- JavaScript minifierJavaScript minifier: remove comments and whitespace, shrink the code and see the saving in bytes. In your browser, no upload.
- Syntax HighlighterSyntax highlighter online: paste code, pick colors for JavaScript, JSON, HTML, CSS, SQL, Python or Bash and copy highlighted HTML for a blog, email or Word.
- CSS clamp calculatorCSS clamp calculator for fluid font sizes and spacing: enter minimum and maximum values plus the viewport range and copy the finished clamp() value.
- JSON Escape / UnescapeJSON escape and unescape online: turn any text into a valid JSON string with escaped quotes, backslashes and line breaks, or decode it back – in your browser.