17 devices · Smartphones
Google devices: CSS viewport, density, and screen resolution
Display characteristics of 17 referenced Google devices, each with the width your media queries respond to, its pixel density, and panel resolution. 6 of these devices can be tested directly in your browser.
Google Smartphones
5 distinct CSS widths cover the entire range: 360, 393, 410, 411 and 412 px. Several models share the same: validating one of them is enough to validate the others.
| Model | CSS Viewport | Density | Panel resolution | Diagonal | Year |
|---|---|---|---|---|---|
| Google Pixel 10 | 412 × 924 | 2.625x | 1082 × 2426 | — | 2026 |
| Google Pixel 10 PRO | 410 × 912 | 3.125x | 1281 × 2850 | — | 2026 |
| Pixel 10 Fold (Unfolded) | 412 × 901 | 2.625x | 1082 × 2365 | — | 2026 |
| Google Pixel 8 | 412 × 915 | 2.625x | 1080 × 2400 | — | 2024 |
| Google Pixel 6 PRO | 360 × 780 | 4x | 1440 × 3120 | 6.7" | 2021 |
| Google Pixel 4a | 393 × 851 | 2.75x | 1080 × 2340 | 5.8" | 2020 |
| Google Pixel 5 | 393 × 851 | 2.75x | 1080 × 2340 | 6" | 2020 |
| Google Pixel 3a | 393 × 808 | 2.75x | 1080 × 2220 | 5.6" | 2019 |
| Google Pixel 3a XL | 412 × 823 | 2.625x | 1080 × 2160 | 6" | 2019 |
| Google Pixel 4 | 393 × 830 | 2.75x | 1080 × 2280 | 5.7" | 2019 |
| Google Pixel 4 XL | 412 × 869 | 3.5x | 1440 × 3040 | 6.3" | 2019 |
| Google Pixel 3 | 393 × 786 | 2.75x | 1080 × 2160 | 5.5" | 2018 |
| Google Pixel 3 XL | 412 × 846 | 3.5x | 1440 × 2960 | 6.3" | 2018 |
| Google Pixel 2 | 412 × 732 | 2.625x | 1080 × 1920 | 5" | 2017 |
| Google Pixel 2 XL | 412 × 823 | 3.5x | 1440 × 2880 | 6" | 2017 |
| Google Pixel | 411 × 731 | 2.6x | 1080 × 1920 | 5" | 2016 |
| Google Pixel XL | 412 × 732 | 3.5x | 1440 × 2560 | 5.5" | 2016 |
Which widths to test first
The most represented widths in the range are 360, 393, 410 and 412 px. Checking them first covers 16 of the 17 referenced Google models, and these should be your first breakpoints.
Go down to 360 px to cover the entire range, including Google Pixel 6 PRO: a layout that fits this width fits everywhere, including the oldest models still in circulation.
Watch out for height: mobile browsers reduce the visible area with their interface bars, and these retract when scrolling. A height of 100vh therefore overflows the first screen; svh and dvh units are preferable.
Test your site on 6 Google devices, without buying a single one
The tables provide measurements. The extension displays your site at the model's exact viewport, with its density, User-Agent, and portrait or landscape switching.
- 6 Google devices ready to use, from older models to this year's releases
- Screenshots and videos exported in the device's format
- Works on your local environments and pre-productions
Free · 4.9/5 on 5,100 reviews
1,500,000+ users
Other brands
Frequently asked questions
What is the most common CSS viewport for Google?
412 x 924 px, shared by 9 of the 17 referenced models, including Google Pixel 10 and Pixel 10 Fold (Unfolded). This is the width to check first in this range.
What minimum width to test to cover Google devices?
360 px, the width of the narrowest model in the list, Google Pixel 6 PRO. If your layout fits at 360 px, it fits on the 17 Google devices listed, up to the widest which reaches 412 px.
Why does the resolution announced by Google not match the CSS viewport?
Because these screens display multiple physical pixels per CSS pixel. Google Pixel 10 has a panel of 1082 x 2426 pixels and a CSS viewport of 412 x 924 px, with a density of 2.625. It's the second value that should be written in a media query.
How to test your site on a Google device without having one?
With the Mobile FIRST extension: it replicates the viewport, pixel density, User-Agent, and touch events of 6 of these models, directly in your browser, including on a localhost address.
The mentioned brands and models belong to their respective owners.