Viewport Studio: responsive testing for Google Chrome
See your website from a wider perspective. Viewport Studio opens the website you are viewing in a responsive workspace, with independently interactive device previews. Compare layouts side by side and make room for any screen size you need.
Coming soon to the Chrome Web Store for desktop Google Chrome.
Your website, across your devices
Browse a searchable library of 199 CSS viewport presets spanning iPhones, Android phones, foldables, Apple and Microsoft tablets, Galaxy tablets, MacBooks, Dell laptops, desktops and TVs. Compare up to eight previews in the same workspace.
The library includes iPhone 5 and estimated iPhone Duo folded and unfolded layouts. Presets represent CSS dimensions, not physical screen pixels. Many newer, Android and desktop sizes are estimates and are labeled in the extension; display settings can change a real device's browser viewport.
Custom sizes, rotation, zoom and mockups
- Custom devices: name a device and set a width and height from 200 to 5,000 CSS pixels.
- Side-by-side comparison: add phones, tablets or larger screens beside one another and interact with each preview.
- Rotate: switch an individual preview between portrait and landscape.
- Canvas zoom: adjust display scale without changing the preview's CSS viewport.
- Mockup styles: choose graphite, silver, lavender or a frameless preview.
- Light or dark: choose the workspace appearance that suits you.
Screenshots, recording and workspace sharing
Save a PNG screenshot or record a silent WebM video through Chrome's screen-sharing picker. Choose the Studio tab to capture the visible workspace, then stop recording to save your video. These tools capture the selected surface's visible area, rather than a full webpage or a transparent individual-device export.
Export your selected website and preview sizes as a JSON workspace file. Someone else can import the file through the extension's Help center to recreate the comparison. Check the included URL before sharing a workspace.
Your workspace stays on your computer
Viewport Studio stores device presets, preview settings and your selected website locally. It needs no account and includes no analytics, advertising or cloud uploads. Websites you preview still connect to their own servers as they normally would. Read the privacy policy for details.
Questions about Viewport Studio
Which browsers and devices does it support?
The extension is built for desktop Google Chrome 116 or later. Its phone and tablet frames are layout previews; the extension does not install as a mobile Chrome app.
Does it emulate Safari, iOS or Android?
All previews render in desktop Chrome. Viewport Studio adjusts CSS viewport dimensions, but does not emulate another browser engine, operating system, touch input, device pixel ratio or a physical foldable hinge. Use actual devices when those differences matter.
Can every website be previewed?
Some websites block embedding through security policies, frame detection, redirects or third-party cookie restrictions. A preview's separate-window button provides a fallback. Internal browser pages cannot be previewed.
Which screenshot and video formats are supported?
Screenshots save as PNG. Recordings save as silent WebM video. MP4, GIF, transparent device exports and full-page capture are not included.
Where do I download Viewport Studio?
The official Chrome Web Store listing is coming soon. The download button on this website will connect to that listing once it is available.
Made by JamesonB Designs
Viewport Studio is developed by JamesonB Designs. For questions, email Info@JamesonBDesigns.com.