Current viewport
0 × 0
Viewport
0 × 0
Browser render area
Screen resolution
0 × 0
Full display size
Available screen
0 × 0
Minus OS bars
Device pixel ratio
Physical : CSS pixels
Color depth
0-bit
Bits per pixel
Orientation
Based on viewport

About the screen resolution tool

Updated June 2026 · 100% client-side — your data never leaves your browser.

Instantly see your screen and browser dimensions — full screen resolution, current viewport size, device pixel ratio, color depth and orientation — all in one place. As you resize the window the viewport figures update live, which makes it easy to find the exact breakpoint a layout issue appears at.

It's a quick reference for responsive web design, QA and writing precise bug reports ("happens at 1280×720 on a 2× display"). Every value is read directly from your browser using standard web APIs and nothing is collected, logged or sent anywhere.

🖥️
Screen & viewport

Full screen resolution plus the current browser viewport size.

🔍
Pixel ratio

Device pixel ratio for retina/HiDPI awareness.

🎨
Color depth

Reports color depth and orientation.

🔒
Local

Read directly from your browser, not collected.

Frequently asked questions

What's the difference between screen resolution and viewport size?

Screen resolution is your display's full pixel size; the viewport is the area your browser renders into, which is smaller because of toolbars, scrollbars and window size.

What is device pixel ratio?

The ratio of physical pixels to CSS pixels. A value of 2 (common on retina/HiDPI screens) means each CSS pixel is drawn with a 2×2 block of physical pixels.

Why does the viewport change when I resize?

The viewport reflects your current browser window, so it updates as you resize — useful for testing responsive breakpoints.

Is any of this data collected?

No. The values are read locally and never sent anywhere.