Screen Resolution & Display Metrics
Check reported screen resolution, viewport size, and device pixel ratio (DPR), color depth, aspect ratios, and simulated physical pixel layouts.
Physical panel layout * DPR value.
Actual canvas area in CSS pixels.
Physical pixels per CSS pixel scaling factor.
⚠️ JavaScript Detection Limitations
Important: Browser-based scripting (JavaScript) cannot always determine the physical, native panel resolution of a monitor. If your operating system is using custom DPI scaling (e.g., Windows 125% or 150% scaling, or macOS Retina scaling), JavaScript reports the virtual screen coordinates multiplied by the scaling factor (DPR). This is a diagnostic estimate and should not replace manufacturer data sheets.
Physical Pixels vs. CSS Viewport Pixels vs. DPR
Modern screens handle coordinates dynamically. Review the definitions of display metric properties:
Physical Panel Resolution
The actual physical grid of light-emitting diodes (subpixels) embedded inside the hardware panel (e.g. 1920x1080 for Full HD, 3840x2160 for 4K Ultra HD).
CSS Viewport size
The coordinate system used by web browsers to layout text and media. On Retina/High-DPI displays, the viewport is smaller than physical pixel structures to keep elements readable.
Device Pixel Ratio (DPR)
The ratio of physical pixels mapping to a single CSS viewport coordinate (e.g., a DPR of 2.00 means 4 physical pixels represent a single CSS layout pixel).