Native resolution 1280 × 2856 px at 3× · 495 PPI · 6.3″ · 9:20. Design at 427 × 952 and export assets at 3×.
| Property | Value |
|---|---|
| CSS viewport (portrait) | 427 × 952 px |
| CSS viewport (landscape) | 952 × 427 px |
| Native resolution | 1280 × 2856 px |
| Device pixel ratio | 3× |
| Pixel density | 495 PPI |
| Screen diagonal | 6.3 in |
| Panel size | 2.59 × 5.77 in |
| Aspect ratio | 9:20 |
| Total pixels | 3.66 MP |
| Released | 2024 |
| Operating system | Android |
Among the 130 phones on this site, the Google Pixel 9 Pro has the 19th largest CSS viewport area. Its 427 px width is 28 px above the 399 px average for this category.
Targeting the Google Pixel 9 Pro in CSS
Device-specific media queries are brittle — a new model with the same width will not match. Use them for genuine per-device fixes only, and prefer width buckets for layout.
/* Target Google Pixel 9 Pro specifically */
@media only screen
and (device-width: 427px)
and (device-height: 952px)
and (-webkit-device-pixel-ratio: 3) {
/* … */
}
/* More useful in practice — the width bucket it falls into */
@media (min-width: 427px) { /* … */ }Compare with other Android Phones models
| Device | CSS viewport | Native | DPR | PPI | Diagonal |
|---|---|---|---|---|---|
| Google Pixel 9 Pro | 427 × 952 | 1280 × 2856 | 3× | 495 | 6.3″ |
| Google Pixel 9 | 412 × 916 | 1080 × 2424 | 2.625× | 422 | 6.3″ |
| Xiaomi 14 | 424 × 944 | 1200 × 2670 | 2.83× | 460 | 6.36″ |
| Samsung Galaxy S24 | 360 × 780 | 1080 × 2340 | 3× | 416 | 6.2″ |
| Google Pixel 8a | 412 × 915 | 1080 × 2400 | 2.625× | 430 | 6.1″ |
| Samsung Galaxy A25 | 360 × 780 | 1080 × 2340 | 3× | 396 | 6.5″ |
| Sony Xperia 1 VI | 393 × 851 | 1080 × 2340 | 2.75× | 396 | 6.5″ |
| Samsung Galaxy A55 | 360 × 780 | 1080 × 2340 | 3× | 390 | 6.6″ |
| Samsung Galaxy A35 | 360 × 780 | 1080 × 2340 | 3× | 390 | 6.6″ |
Questions about the Google Pixel 9 Pro screen
What is the screen size of the Google Pixel 9 Pro?
The Google Pixel 9 Pro has a 6.3-inch display. In CSS the viewport measures 427 × 952 px in portrait, and the panel itself has 1280 × 2856 physical pixels at 495 PPI.
What resolution should I design for on the Google Pixel 9 Pro?
Design at 427 × 952 and export assets at 3×. That gives you 1280 × 2856 px images, which is exactly what the panel renders. Designing directly at 1280 × 2856 means every measurement is 3 times larger than the CSS values you will write.
What is the device pixel ratio of the Google Pixel 9 Pro?
The Google Pixel 9 Pro reports a device pixel ratio of 3. One CSS pixel therefore covers 9 device pixels. You can read it in JavaScript with window.devicePixelRatio.
Which other devices have the same viewport as the Google Pixel 9 Pro?
1 other device shares the 427 × 952 CSS viewport: Google Pixel 10 Pro. A layout that works on one works on all of them.
Related
window.innerWidth/innerHeight reported by the stock browser with no browser chrome. See methodology and sources.