Skip to main diagnostic tool
📐 Viewport & Geometry

What Is My Screen Size & Display Resolution?

Real-time hardware inspection reading CSS viewport resolution, physical display resolution, Device Pixel Ratio (DPR), and color bit depth.

Native Screen ResolutionLoading...Total Display Hardware Pixels
Browser Viewport SizeLoading...Active CSS Render Window
Device Pixel Ratio (DPR)1.0xHiDPI Hardware Scaling Factor
Aspect Ratio16:9Widescreen Geometry
Color Depth24-bit (sRGB)8-bit per RGB Channel
Screen OrientationLandscapePrimary Window Orientation

Understanding Display Resolution, Logical CSS Pixels & Device Pixel Ratio

Modern web browsers operate across two distinct dimensional coordinate systems: Physical Hardware Pixels and Logical CSS Viewport Pixels. In the early era of computing, one CSS pixel corresponded directly to one physical transistor dot on a cathode ray tube (CRT) or early LCD panel (a Device Pixel Ratio of 1.0).

With the advent of high-density Apple Retina displays and 4K desktop monitors, rendering at a 1:1 pixel scale made text and user interface controls microscopically small. Operating systems introduced Display Scaling (HiDPI / DPI virtualization), which groups clusters of physical pixels together to render sharp vector typography while maintaining comfortable ergonomic sizing.

Mathematical Breakdown of Device Pixel Ratio (DPR)

The mathematical formula governing screen resolution detection is:

Physical Resolution (W×H) = CSS Viewport (W×H) × window.devicePixelRatio

For instance, an Apple MacBook Pro running a 3024×1964 physical panel at "Default for Display" (2x Retina scaling) presents a logical CSS viewport of 1512 × 982 with a devicePixelRatio of 2.0.

Comparison Table: Standard Display Formats, Resolutions & Aspect Ratios

The table below details standard commercial resolution classifications, their total pixel payloads, and native aspect ratios:

Standard NameCommon AcronymPixel Resolution (W×H)Total MegapixelsAspect RatioTypical Form Factor
Full High Definition1080p / FHD1920 × 10802.07 MP16:924" Desktop, Budget Laptops
Quad High Definition1440p / QHD / 2K2560 × 14403.69 MP16:927" Competitive Gaming Monitors
Ultra High Definition4K / UHD / 2160p3840 × 21608.29 MP16:927"–32" Creative & Productivity Displays
Ultra-Wide QHDUWQHD3440 × 14404.95 MP21:934" Curved Productivity & Simulators
Dual Quad HDDQHD5120 × 14407.37 MP32:949" Super Ultrawide Workstations
5K Studio Retina5K UHD5120 × 288014.75 MP16:927" Apple Studio Display

How to Change Display Resolution and Scaling on Windows 11 & macOS

If your detected resolution does not match your panel's native capabilities, adjust your operating system's display settings:

  • Windows 11: Navigate to Settings → System → Display. Under Display resolution, ensure the dropdown is set to the option labeled (Recommended). Under Scale, choose 100% for 1080p/1440p or 150% for 27-inch 4K.
  • macOS: Open System Settings → Displays. Click on your active monitor. Select Default for native Retina rendering, or click Advanced to view all raw hardware resolution options.
Hardware Knowledge Base

Frequently Asked Questions

Technical answers to common hardware, refresh rate, and browser diagnostic questions.

Why does this tool show a different resolution than my monitor box?

Your monitor box lists physical hardware pixel dimensions (e.g. 3840×2160 for 4K). If your operating system has UI scaling enabled (e.g. 150% in Windows or 2x HiDPI in macOS), the browser reports CSS viewport resolution (e.g. 2560×1440 or 1920×1080) multiplied by window.devicePixelRatio.

What is Device Pixel Ratio (DPR)?

Device Pixel Ratio (DPR) is the ratio between physical display hardware pixels and logical CSS pixels (DPR = Physical Pixels / CSS Pixels). Standard 1080p desktop monitors have a DPR of 1.0, while Apple Retina screens feature a DPR of 2.0 or 3.0.

How can I accurately calculate physical screen diagonal in inches without a tape measure?

Because browsers cannot query the physical millimeter width of your monitor chassis directly over web security sandboxes, our tool calculates diagonal size by inputting your panel's known PPI into the geometric Pythagorean formula D = sqrt(W^2 + H^2) / PPI.

What is the difference between Screen Resolution and Viewport Size?

Screen Resolution is the total addressable pixel dimensions of your entire monitor display (e.g. window.screen.width × window.screen.height). Viewport Size is the usable content area inside your active browser window excluding title bars, address bars, and browser tabs (window.innerWidth × window.innerHeight).

Why do ultrawide monitors have non-standard 21:9 or 32:9 aspect ratios?

Standard widescreen monitors use a 16:9 aspect ratio (1.77:1). Ultrawide displays expand horizontal peripheral vision using 21:9 (2.33:1, such as 3440×1440) or 32:9 Super Ultrawide (3.55:1, such as 5120×1440), providing the equivalent workspace of dual seamless monitors.