Current phones report a CSS viewport between about 360 and 440 pixels wide, and tablets between 744 and 1032. Compact Android phones sit at 360, iPhones at 375 to 440, larger Android phones at 412 and up, the iPad mini at 744, and the 11-inch and 13-inch iPads at 820 to 1032. This page lists the numbers per device, explains why Android values differ from source to source, and ends with the short list of widths to test.
Pick a device in the preview below, enter your address and see your own site at that size.
The widths that matter
A layout does not need a test for every model. These widths cover the real spread:
| CSS width | Typical devices | Why it matters |
|---|---|---|
| 320 | iPhone SE (1st gen), iPad in Split View | The narrowest width where nothing should break |
| 360 | Galaxy S24 and S25, OPPO A6x, many mid-range Androids | The common compact Android width |
| 375 | iPhone SE (2nd and 3rd gen), mini models | Still in use on older iPhones |
| 390 to 393 | iPhone 14 to 16, Redmi Note 14 | The mainstream iPhone width |
| 402 | iPhone 17, 17 Pro, 18 Pro | The current default iPhone |
| 412 to 414 | Pixel 7 to 10, Galaxy S24+ and Ultra | The common large Android width |
| 430 to 440 | iPhone Plus and Pro Max | The widest regular phones |
| 744 to 768 | iPad mini, older 9.7-inch iPads | Small tablets |
| 820 to 834 | iPad (A16), iPad Air 11, iPad Pro 11 | Standard tablet portrait |
| 1024 to 1032 | iPad Air 13, iPad Pro 12.9 and 13 | Large tablet portrait, small laptop landscape |
Android phones: why the numbers differ between sources
Android has no single official table, and the public lists disagree. Screen Size Checker gives the Galaxy S25+ a 412 × 891 viewport, while WhatIsMyScreenSize gives it 480 × 1040. Both divide the panel resolution by an estimated pixel ratio, and Android ratios are often fractional (2.625, 3.125, 3.25), so a small change in the estimate moves the width by dozens of pixels. Both pages say their values are approximate.
The table below uses values where the sources agree or where the device is a preset in our own tool, and marks the rest as approximate:
| Device | CSS viewport (portrait) | Pixel ratio |
|---|---|---|
| Galaxy S24, S25 | 360 × 780 | 3 |
| OPPO A6x | 360 × 785 | 2 |
| Galaxy S24+, S24 Ultra, S25 Ultra (approximate) | 412 × 891 | 3.5 |
| Pixel 8 | 412 × 915 | 2.625 |
| Pixel 9, Pixel 10 | 412 × 923 | 2.625 |
| Pixel 9 Pro, Pixel 10 Pro | 410 × 914 | 3.125 |
| Pixel 9 Pro XL, Pixel 10 Pro XL | 414 × 921 | 3.25 |
| Galaxy Z Fold6, cover screen | 323 × 792 | 3 |
| Galaxy Z Fold6, open | 619 × 720 | 3 |
Foldables are the reason to test a width below 360 and one around 620 to 720. Opened, they sit between a phone and a tablet, and a layout built only for the two ends can look stretched there.
iPhones
iPhone widths are well documented. They run from 320 on the first SE to 440 on the Pro Max models, with 375, 390, 393, 402, 420 and 430 in between. The full list with resolutions and pixel ratios is in the iPhone viewport chart.
iPads and tablets
Tablet viewports in portrait, from the Screen Size Checker iPad list. Landscape swaps width and height, and all iPads have a pixel ratio of 2.
| Model | CSS viewport (portrait) |
|---|---|
| iPad mini (A17 Pro, 6th gen) | 744 × 1133 |
| iPad (9th gen) | 810 × 1080 |
| iPad (10th gen, A16), iPad Air 11 | 820 × 1180 |
| iPad Pro 11 (2018 to 2022) | 834 × 1194 |
| iPad Pro 11 (M4) | 834 × 1210 |
| iPad Air 13, iPad Pro 12.9 | 1024 × 1366 |
| iPad Pro 13 (M4) | 1032 × 1376 |
Two things make iPads harder than the table suggests. First, Safari on iPad asks for the desktop version of a site by default, so a page can get a desktop layout at 820 pixels (see how to view a website as an iPad in Chrome). Second, multitasking shrinks the window: Maximiliano Firtman’s viewport notes list widths from 320 to 694 pixels for Split View and Side View, so your tablet layout can be asked to render at a phone width. Without a viewport meta tag, the same notes record a 980 pixel layout on iPads.
How to read the real size on your own device
Reference tables are a starting point. To see what your device reports, open the browser console, or any page that prints it, and run:
`${innerWidth} × ${innerHeight} @ ${devicePixelRatio}x`Settings change the result: Samsung’s screen zoom and display size, the browser’s text scaling, whether the address bar is collapsed, and orientation. What is viewport size explains why the height keeps changing.
Which widths to test
Test at 360 and 412 for Android, 390 and 402 for iPhone, 744 and 834 for tablets, then add 320 as a stress case and a landscape view of one phone and one tablet. Do not turn these numbers into breakpoints: device-based breakpoints age fast, and responsive breakpoints should follow where your own layout breaks. The sizes are for checking, and how to test responsive design covers the full routine.
Frequently asked questions
What screen size should I design a mobile site for?
Start at 360 to 390 pixels wide and let the layout flex up to about 440. Avoid fixed pixel widths on containers, so the page also works at 320 and on opened foldables.
Is a phone’s screen size the same as its viewport?
No. The screen resolution counts physical pixels, and the viewport counts CSS pixels, which is the resolution divided by the pixel ratio. A 1206 × 2622 iPhone display gives a 402 × 874 viewport.
Why does my phone report a different size than these tables?
Reference lists estimate the pixel ratio, and your device also applies its own display size, zoom and browser settings. Trust the number from your own browser when it differs.
Sources: Screen Size Checker, Android and iPad lists (data review 24 September 2026, values marked unverified by the site); WhatIsMyScreenSize, Android CSS viewport sizes (31 July 2026, approximate); Maximiliano Firtman, viewports; YesViz, Galaxy S25. Re-check against your own devices before you rely on a value.