{{ summaryTitle }} {{ summaryValue }} {{ summaryLine }} {{ badge.label }}: {{ badge.value }}
Compare the current viewport and screen with common device widths, Bootstrap 5, or Tailwind defaults.
Readings also refresh when the browser window changes size.
Optional. Leave blank for layout-only readings; changing units preserves the same physical diagonal.
MetricReadingMeaningCopy
{{ row.label }}{{ row.value }}{{ row.detail }}
The chart renderer is unavailable. The current breakpoint reading remains in the snapshot and exported CSV.
TargetDimensionsUseCopy
{{ row.label }}{{ row.value }}{{ row.detail }}
Netcat Command Generator Build shell-quoted Netcat or Ncat commands for authorized socket tasks with variant compatibility checks and warnings for risky options.
SQL INSERT Generator Turn pasted rows or a local delimited file into reviewable SQL INSERT statements with dialect-aware identifiers, literal handling, and row checks.
What Is My Browser Identify your current browser session, check storage and graphics readiness, and review privacy exposure before sharing a support report.
What Is My Internet Protocol (IP) Address? Check the public IPv4 or IPv6 address visible to your browser, with ASN, network owner, approximate location, and provider coverage.

A web page does not lay itself out against the full hardware pixel grid. It uses a browser viewport measured in CSS pixels, which can be much smaller than the screen and can change whenever the window, zoom level, display scaling, or active monitor changes.

That distinction matters during responsive design, screenshot planning, support calls, and remote testing. A laptop may report a wide screen while a half-width browser window triggers a tablet breakpoint. A high-density phone may use several device pixels to draw one CSS pixel, so its screenshot dimensions can be much larger than the width used by CSS.

Screen size
The display coordinate space the browser exposes, measured here in CSS pixels.
Available screen
The exposed screen area left after operating-system interface reservations such as a taskbar or dock.
Viewport
The current page layout area inside the browser window. Responsive breakpoints use this width, not the full screen width.
Device-pixel ratio
The number of device pixels represented by one CSS pixel. It is commonly shortened to DPR.

Resolution alone does not reveal physical size or sharpness. Two displays can expose the same CSS dimensions while using different native pixel grids, diagonals, or operating-system scaling. Pixels per inch (PPI) can only be estimated when the physical diagonal is known, and even then the result assumes the browser-reported pixel scale describes the whole panel.

Treat browser measurements as a snapshot of the current browsing environment. They are useful for reproducing a layout and estimating raster capture size, but they are not a hardware inventory, an EDID reading, or proof of the panel manufacturer's native mode.

How to Use This Tool:

Start with the browser window in the size and zoom state you want to inspect.

  1. Choose a Breakpoint guide for common device widths, Bootstrap 5, or Tailwind defaults. The choice changes the comparison thresholds, not the browser readings.
  2. Resize the window or select Refresh readings. Confirm that Current viewport reflects the page area you intend to reproduce.
  3. Enter the display diagonal only when you need estimated physical width, height, or PPI. Leave it blank for layout and screenshot work.
  4. Read the display snapshot first, then compare the breakpoint fit and capture targets when those decisions matter.

Interpreting Results:

Viewport is the best number for reproducing responsive layout. Screen describes the browser-exposed display space, while Viewport at device pixels is the approximate raster size produced by multiplying the viewport by DPR.

  • A wide gap between screen and viewport widths usually means the window is constrained; it does not mean the display is low resolution.
  • A fractional DPR is valid and often comes from browser zoom or operating-system scaling. Expect rounded device-pixel dimensions.
  • A breakpoint match names the highest threshold at or below the current viewport. It does not identify the physical device.
  • An estimated PPI is only as reliable as the entered diagonal and the browser's exposed screen and DPR values.

Technical Details:

CSSOM View defines browser-exposed screen and viewport dimensions in CSS pixels. Device-pixel dimensions are derived rather than read as a separate hardware mode, so scaling and privacy behavior can affect the values available to a page.

Formula Core

The raster estimate rounds the product of a CSS dimension and DPR to the nearest whole device pixel.

Wdevice = round ( WCSS × DPR )

Viewport share compares the current layout area with the exposed screen. Width share uses one dimension; area share uses both dimensions.

Swidth = WviewportWscreen ×100% Sarea = Wviewport×Hviewport Wscreen×Hscreen ×100%

When a diagonal is supplied, centimetres are divided by 2.54. The screen's device-pixel diagonal is found with the Pythagorean theorem. Physical width and height preserve the same pixel aspect ratio, and PPI divides that pixel diagonal by the physical diagonal.

Lpixels= Wdevice2+Hdevice2 Winches= Dinches×WdeviceLpixels Hinches= Dinches×HdeviceLpixels PPI= LpixelsDinches

Lookup Core

The current breakpoint lane is the last threshold whose minimum width is less than or equal to the viewport. The next breakpoint is the first larger minimum.

Guide Thresholds in CSS px
Common widths320, 375, 390, 414, 768, 1024, 1280, 1440
Bootstrap 5xs 0, sm 576, md 768, lg 992, xl 1200, xxl 1400
Tailwind defaultbase 0, sm 640, md 768, lg 1024, xl 1280, 2xl 1536

The suggested capture scale is 1× below DPR 1.5, 2× from DPR 1.5 up to but not including 2.5, and 3× at DPR 2.5 or higher. It is a handoff convention, not a claim about the display's native scale.

The aspect ratio divides the rounded screen width and height by their greatest common divisor. Diagnostic flags appear when the viewport exceeds screen width by more than 2 CSS px, the screen-minus-viewport gap is at least 240 CSS px, or DPR is fractional. A physical diagonal is valid when blank or from 2 through 120 inches after unit conversion.

Accuracy Notes:

Browsers may reduce or alter exposed screen information for privacy, and measurements can change with page zoom, operating-system scaling, window size, remote desktop sessions, and the active monitor.

  • The reading does not query display firmware, native panel mode, physical dimensions, or monitor model.
  • The optional diagonal must describe the same display represented by the browser readings.
  • Use operating-system display settings or hardware documentation when exact physical specifications matter.

References: