Back to Website

Responsive Development Utility

Your Display & Viewport Information

Use these values when reporting layout or responsive issues to the development team. Nothing on this page is saved or transmitted by this tool.

Current Viewport The browser area currently available to the webpage, not the full monitor. Example: a 1920 × 1080 screen might have a 1440 × 823 viewport after browser chrome and window sizing. The breakpoint below shows which common responsive width range this viewport falls into.
Screen Resolution The screen size reported by the browser in CSS pixels. Example: a laptop may report 1920 × 1080 CSS px.
Estimated Physical Pixels An estimate of the actual hardware pixel count using screen size × device pixel ratio. Example: 1440 × 900 at DPR 2 estimates 2880 × 1800 physical pixels.
Available Screen Area The usable screen area after operating-system UI such as the taskbar or dock is excluded. Example: 1920 × 1040 on a 1920 × 1080 display.
Viewport Aspect Ratio The width-to-height shape of the browser content area. Example: a 1440 × 810 viewport is 16:9.
Screen Aspect Ratio The width-to-height shape of the full screen. Example: 1920 × 1080 is 16:9, while 2560 × 1600 is 16:10.
Device Pixel Ratio How many physical pixels the device uses for one CSS pixel. Example: DPR 2 means one CSS pixel can map to roughly 2 × 2 hardware pixels on a Retina/HiDPI display.
Orientation Whether the current display is wider than tall or taller than wide. Example: phones are often portrait; laptops are usually landscape.
Primary Input Describes the main pointing method and hover capability. Example: a mouse is usually a fine pointer with hover; a touchscreen is usually a coarse pointer without hover.
Touch Support Reports whether the browser exposes touch points. Example: a phone may report 5 touch points; a standard desktop may report none.
Scrollbar Width The horizontal space used by the browser scrollbar when it consumes layout width. Example: some desktop browsers use about 15–17 px, while overlay scrollbars may use 0 px.
Browser The browser family detected from information exposed by the browser. Example: Chrome, Safari, Firefox or Microsoft Edge.
Platform The operating-system platform string exposed by the browser. Example: macOS, Windows, Linux or another browser-reported platform.
Preferred Colour Scheme The light or dark appearance preference currently reported by the device/browser. Example: Dark can trigger a website dark-mode stylesheet when supported.
Reduced Motion Shows whether the user has requested less animation in accessibility settings. Example: Reduce should be respected by disabling or simplifying non-essential motion effects.
Privacy note: This utility performs all checks locally in your browser. It does not use cookies, AJAX, REST requests, analytics hooks, geolocation or persistent visitor storage.