Converter Web ToolsConverter WebTools

What Is My Viewport Size?

See your browser viewport (window) size, the full document size, device pixel ratio and scrollbar width — it updates live as you resize.

Your browser viewport is
…
CSS pixels · resize the window to watch it change
Viewport (window)
Document size
Screen resolution
Device pixel ratio
Scrollbar width
Orientation
The viewport is the visible area of the web page in your browser window — smaller than your screen if the window isn't maximised. Useful for responsive web design and testing breakpoints.

What is Viewport Size?

The viewport is the visible area of a web page inside your browser window. This tool shows your current viewport width × height in CSS pixels, the full document size, your screen resolution, device pixel ratio and scrollbar width, and updates instantly as you resize the window. It is essential for responsive web design and testing CSS breakpoints.

How Viewport Size works

It reads window.innerWidth × window.innerHeight for the viewport, compared with screen.width × screen.height for the whole display. The viewport is smaller than the screen when the window isn't maximised or when browser toolbars take space.

Common uses

  • Check your browser window (viewport) dimensions
  • Test responsive design breakpoints
  • Compare viewport vs screen vs document size
  • Measure the scrollbar width

Frequently asked questions

What is the viewport?
The visible part of a web page in your browser window — what CSS media queries respond to.
Why is my viewport smaller than my screen?
Because the browser window may not be full-screen, and toolbars, tabs and scrollbars take up space.
What are CSS pixels?
The logical pixels CSS uses. On high-DPI screens, one CSS pixel can be several physical pixels (the device pixel ratio).