← Back to Dev Tools
Live Updating

Viewport & Breakpoint Tester

Live viewport dimensions · breakpoint detection · media query checker · device profiles

Live Viewport
WIDTH px
×
HEIGHT px
Aspect Ratio
Orientation
Device Pixel Ratio
Scroll Width
16px Root em
Screen res
Breakpoint Position
Active:


                
Device Profiles — Click to Simulate
⚠ Simulation sets CSS variables only — use browser DevTools device mode for true pixel emulation. Useful for checking your breakpoint logic.
Test a Media Query

Paste any @media condition — tested live against your real viewport.

Snap History
  • No snaps yet — resize and click Snap Size.

Why Viewport Testing Matters

Responsive bugs almost always hide in the gap between what you think the breakpoint is and what the browser actually sees. This tool gives you the exact numbers, framework-mapped breakpoints, and a media query sandbox — all updating live as you resize.