Adjusting Viewport for Instant Website Screenshots

Viewport and Responsive Design

The viewport is the screen viewing area of a website measured in height and width in pixels. When taking a screenshot of a website, adjusting the viewport to match the desired screen size is important to ensure the highest quality image.

With responsive design becoming increasingly important in web development, capturing website screenshots for different devices and screen sizes is essential. By adjusting the viewport, you can generate instant, high quality screenshots for Full HD desktops, laptops, tablets, and mobile devices.

Instant Website Screenshots

Our website screenshot generator allows you to adjust the viewport to capture screenshots of websites for different screen sizes and devices. With just a few clicks, you can generate instant screenshots for Full HD desktops, laptops, tablets, and mobile devices.

Our tool is perfect for web developers, designers, and marketers who need high quality screenshots for presentations, reports, or website analysis. Adjusting the viewport allows you to capture the perfect image, no matter what device your website is viewed on.

Default Viewport for Website Screenshots

The default viewport is 1920x1080, which is the most common Full HD (1080p) desktop screen resolution used in countries such as North America.

Visit statscounter.com to see popular screen resolutions (viewports) worldwide, or filter the results by region and platform such as desktop, tablet and mobile devices.

Screenshot Request - Mobile Device

Here is an example request to take a screenshot with a 414x896 viewport to mimic an iPhone 11:

// Line breaks added for readability https://api.addscreenshots.com/screenshots
?apikey=YOUR_API_KEY
&viewport=414x896
&url=https://www.apple.com/iphone11/

Your API key can be found on the API Keys page. Need an API Key? Sign up to get started.
For internal applications, replace YOUR_API_KEY with your own unique API Key.
For public facing websites or hotlinks, generate a signed URL.

Screenshot Response - Mobile Device

Mobile phone screenshot example: Mobile Screenshot


Tablet Screenshot (768x1024)

// Line breaks added for readability https://api.addscreenshots.com/screenshots
?apikey=YOUR_API_KEY
&viewport=768x1024
&url=youtube.com

Tablet Website Screenshot


Small Desktop Screenshot (1024x768)

// Line breaks added for readability https://api.addscreenshots.com/screenshots
?apikey=YOUR_API_KEY
&viewport=1024x768
&url=youtube.com

Desktop Website Screenshot


Tiny Desktop Screenshot (800x600)

// Line breaks added for readability https://api.addscreenshots.com/screenshots
?apikey=YOUR_API_KEY
&viewport=800x600
&url=youtube.com

Desktop Website Screenshot


iPhone 6, 7 & 8 (375x667)

// Line breaks added for readability https://api.addscreenshots.com/screenshots
?apikey=YOUR_API_KEY
&viewport=375x667
&url=youtube.com

Note: The screenshot below is not optimized for a mobile device. Use &mobile=true to mimic a mobile or tablet device.

iPhone Screenshot

// Line breaks added for readability https://api.addscreenshots.com/screenshots
?apikey=YOUR_API_KEY
&viewport=375x667
&mobile=true
&url=youtube.com

Success: The screenshot below is optimized for a mobile device.

iPhone Mobile Screenshot