Front-end engineers
Verify breakpoints against the live DOM at true device widths, with no DevTools toggle and no window gymnastics.
Viewport overlays true-to-spec device frames on the site you are already viewing. Compare breakpoints side by side, catch layout bugs before QA does, and export framed screenshots or 4K recordings - entirely on your own machine.
Any site · 38 devices · Settings synced across tabs · No account, no telemetry, no upload
The people who build responsive interfaces, the people who design them, and the people who have to prove they work.
Verify breakpoints against the live DOM at true device widths, with no DevTools toggle and no window gymnastics.
Check spacing, type scale and safe areas in accurate frames, then export framed captures straight into a spec or a deck.
Prove responsive quality live on a call. One screen-share shows desktop and mobile behaving together, with no split windows.
No feature soup. These are the four capabilities the whole extension is built around.
This is the real workflow: pick a device from the toolbar, rotate it, fire a screenshot, hit record. The page behind it is your site.
Responsive quality is far easier to show than to describe. Viewport turns an internal check into something you can hand straight to a client.
No config file, no account, no project setup.
Click the toolbar icon. A device appears over the live site, already loaded and fully interactive.
Pick a device, rotate, scale and drag it anywhere - or lay out a whole board of phones, tablets and monitors.
Scroll in lockstep across every frame, then export a framed screenshot or record the entire walkthrough.
Checked against the most-installed responsive preview extensions on the Chrome Web Store.
| Capability | Viewport | Typical simulator |
|---|---|---|
| Device frames | Vector, every device | Bitmap, a handful |
| Site refuses framing | Real-window fallback | Error message |
| Security headers relaxed | Previewed origin only | Every frame in the tab |
| Tells you it relaxed them | On screen, while active | Buried in the policy |
| MP4 export | Production H.264 | Marked experimental |
| Recording resolution | Up to 4K, adaptive | 1080p |
| Client hints match the UA | Always | Contradictory |
| Network throttling | 3G / 4G / offline | - |
| Touch-target and contrast audit | Built in | - |
| Sends data anywhere | Never | Varies |
Viewport has no backend for your data. No analytics, no telemetry, no remotely-loaded code. Settings live in chrome.storage.local; captures download straight to your disk.
To render a page inside a frame, browsers require us to relax X-Frame-Options and Content-Security-Policy on the preview request. We scope that to the previewed origin alone - third-party frames on the page keep their protections - and show a banner while it is active. It is removed the moment you close the preview.
Most tools do this silently, and tab-wide. We would rather you knew.
The free tier is a working tool with no time limit, not a trial.
The five questions every developer asks before installing.
No - nothing that runs inside a browser does. Viewport renders your real page at true device viewport widths with matching client hints, which catches the overwhelming majority of layout and breakpoint problems. Release-critical checks still belong on real devices.
Add Viewport to Chrome and check every device on the page you are already looking at. Free, no account, nothing uploaded.