Skip to content

Screen Resolution Detector

Detect your screen resolution, viewport size, pixel ratio, color depth, and display information.

Screen Resolution Detector tool

Detecting display information...

Example

Input: A 1920 x 1080 monitor at 100% scaling, browser window maximized

Result: Desktop - Landscape - 1x DPR, CSS Resolution 1920 x 1080, Physical Pixels 1920 x 1080 (viewport depends on the browser toolbars)

Physical pixels are the CSS resolution multiplied by the device pixel ratio. On a phone with a DPR of 3, a 390 x 844 CSS screen is 1170 x 2532 physical pixels.

Viewport Width, Device Label and Breakpoints

Viewport widthDevice type shownActive breakpoints
320 pxMobileNone
390 pxMobileNone
640 pxTabletsm
768 pxTabletsm, md
1024 pxDesktopsm, md, lg
1280 pxDesktopsm, md, lg, xl
1536 pxDesktopsm, md, lg, xl, 2xl

Computed with the tool rules: under 640 px is Mobile, under 1024 px is Tablet, and breakpoints are min-width.

  1. Open the tool to see your screen and viewport sizes straight away.
  2. Read your screen resolution, viewport size and device pixel ratio.
  3. Check the color depth, orientation and active breakpoints.
  4. Resize your browser window and watch the viewport numbers update.
  5. Copy the viewport or screen size to share with a developer or support team.

Screen Resolution, Viewport and Pixel Ratio

This page shows your screen resolution in CSS pixels, the real physical pixel count, your browser viewport size and your device pixel ratio (DPR). The numbers update live as you resize the window or turn your phone.

Three sizes are easy to mix up. Screen resolution is the whole display as the browser reports it, in CSS pixels. The viewport is the part of the window where a page is drawn, without toolbars and tabs. The physical pixel count is the screen size times the DPR. A phone that reports 390 x 844 with a DPR of 3 has 1170 x 2532 real pixels. Responsive layouts and CSS media queries use the viewport width, not the physical count.

Operating system scaling changes what you see. On Windows at 150% scaling, a 2560 x 1440 monitor reports a CSS resolution of about 1707 x 960 and a DPR of 1.5. Zooming a page in a desktop browser changes the DPR and the viewport too. Reset zoom to 100% before you copy numbers for a bug report.

The page also shows the available screen, which leaves out the taskbar or dock. You also see the outer window size, the space used by browser toolbars, color depth, orientation and aspect ratios. The breakpoint list shows which common min-width breakpoints are active: 640, 768, 1024, 1280 and 1536 pixels, the Tailwind CSS defaults. The device label is a simple rule based on viewport width. Under 640 pixels is Mobile, under 1024 is Tablet, and anything wider is Desktop.

All values come from standard browser properties, and nothing leaves your device. To work out image or video sizes for a given shape, try the Aspect Ratio Calculator.

Frequently Asked Questions

Browsers report size in CSS pixels, and your system scaling divides the real pixels. A 3840 x 2160 monitor at 200% scaling reports 1920 x 1080 with a DPR of 2. Check the Physical Pixels row: it multiplies the CSS size by the DPR and should match the spec, give or take rounding.
DPR is the number of physical pixels per CSS pixel along each side. A DPR of 2 means each CSS pixel is drawn with a 2 x 2 block of 4 real pixels, which gives sharper text. Most phones have a DPR of 2 or 3. Developers use it to serve images at 2x or 3x size so they stay crisp.
Mobile browsers hide the address bar and toolbar as you scroll down and show them again as you scroll up. The visible area grows and shrinks, so the viewport height changes while the width stays the same. CSS has units such as svh, lvh and dvh to handle the small, large and dynamic heights.
Use Copy Viewport and Copy Screen at the top, which copy values like 1440x789. Also tell them your device pixel ratio, browser and zoom level. The viewport is usually the number that matters for layout bugs, because that is the width media queries respond to.

Related Tools

User Agent Parser

Parse and detect your browser name, version, operating system, device type, and rendering engine.

Security and Encryption

IP Address Info

Detect your public IP address and view geolocation data, ISP details, and network information.

Security and Encryption

Aspect Ratio Calculator

Calculate and convert aspect ratios for images, videos, and screens. Find missing dimensions instantly.

Image and Media

Image Resizer

Resize images to exact pixel dimensions with an optional aspect ratio lock, entirely in your browser.

Image and Media

Keycode Info

Press any key to see its JavaScript keyCode, key, code, which, and location event properties.

Web and SEO Tools