Your live viewport dimensions — the size CSS media queries actually see, with Tailwind and Bootstrap breakpoints highlighted as you resize.
Your viewport size is
Try resizing this window — all values update live
Paste the report into a bug ticket, or send the link to support/QA. Nothing is stored on our servers.
Measure the live viewport, then copy a QA-ready handoff for bug reports and responsive testing.
Three different sizes are easy to confuse. The screen is your whole display. The window is your browser, including its UI. The viewport is the part of the window where the page renders — the only one of the three that responsive design responds to. Resize this window and watch the viewport value and the breakpoint marker track it live.
When debugging a layout issue, the viewport size plus the device pixel ratio tells you almost everything about the rendering environment. Use the framework breakpoint rail and test-width table above to check mobile, tablet and desktop thresholds, open the responsive breakpoint checker for framework-specific ranges, then use the responsive testing checklist for navigation, grids, forms and other real UI patterns before copying the report into a bug ticket.
Most media queries are written against viewport width because columns, navigation and cards usually break horizontally first. Test exact widths just below and above your layout thresholds, not only named device presets.
Mobile browser bars, installed web apps and virtual keyboards can change the visible height while the width stays stable. Use height values for overflow and modal testing, but avoid using one fixed height as a proxy for a device model.
The viewport is the area of the browser window where the page actually renders — the window minus tabs, address bar, bookmarks bar and (on some platforms) scrollbars. CSS media queries, vw/vh units and JavaScript's window.innerWidth all measure the viewport.
Because the browser's interface takes up space, and your window may not be maximized. The live diagram above shows exactly how your viewport nests inside the window and screen.
Media queries like @media (min-width: 768px) respond to the viewport width in CSS pixels — the first number shown above. They never see your physical screen resolution.
Most current iPhones are 393 × 852 or 430 × 932 CSS pixels; most Androids are 360–412 px wide. See our iPhone viewport table for the full list.