Viewport sizes for iPhone, Android, iPad and laptops (2026)

A viewport size is the width and height a device gives a web page, in CSS pixels. It is not the screen's resolution: an iPhone 17 Pro has a 1206 × 2622 pixel panel, but a page sees 402 × 874, because each CSS pixel is drawn with 3 × 3 physical pixels. That factor is the device pixel ratio (DPR).

The tables below come from Panescope's device library, which we keep for the extension. Sizes are in portrait for phones and tablets and in landscape for laptops. Sources: Apple's published logical resolutions, Chrome DevTools' emulated devices and measured viewport data.

iPhone

Android phones

Foldables

Tablets

Laptops and desktops

What to do with these numbers

• Design breakpoints around your content, not around devices; then check the devices that sit just above and below each breakpoint.
• Always test 360 px wide: it is still the narrowest common phone, and the most likely to overflow.
• Serve images for the DPR: a 400 px wide image slot on a DPR 3 phone needs a 1200 px image to look sharp.

Panescope includes all of these devices (and custom ones you add), each with its size, DPR and user agent, so you can open several at once. See how to test on multiple devices at once.