This comprehensive guide provides detailed viewport sizes and screen resolutions for all iPhone models. Essential information for web developers and designers working on responsive websites and applications.
| Model | Viewport Size | Screen Resolution | DPR | Release Year |
|---|---|---|---|---|
| iPhone 16 Pro Max | 440 x 956 | 1320 x 2868 | 3.0 | 2024 |
| iPhone 16 Pro | 402 x 874 | 1206 x 2622 | 3.0 | 2024 |
| iPhone 16 Plus | 428 x 926 | 1284 x 2778 | 3.0 | 2024 |
| iPhone 16 | 393 x 852 | 1179 x 2556 | 3.0 | 2024 |
| iPhone 15 Pro Max | 430 x 932 | 1290 x 2796 | 3.0 | 2023 |
| iPhone 15 Pro | 393 x 852 | 1179 x 2556 | 3.0 | 2023 |
| iPhone 15 Plus | 430 x 932 | 1290 x 2796 | 3.0 | 2023 |
| iPhone 15 | 393 x 852 | 1179 x 2556 | 3.0 | 2023 |
| iPhone 14 Pro Max | 430 x 932 | 1290 x 2796 | 3.0 | 2022 |
| iPhone 14 Pro | 393 x 852 | 1179 x 2556 | 3.0 | 2022 |
| iPhone 14 | 390 x 844 | 1170 x 2532 | 3.0 | 2022 |
| iPhone 13 Pro Max | 428 x 926 | 1284 x 2778 | 3.0 | 2021 |
| iPhone 13 Pro | 390 x 844 | 1170 x 2532 | 3.0 | 2021 |
| iPhone 13 | 390 x 844 | 1170 x 2532 | 3.0 | 2021 |
| iPhone 13 mini | 375 x 812 | 1125 x 2436 | 3.0 | 2021 |
| iPhone 12 Pro Max | 428 x 926 | 1284 x 2778 | 3.0 | 2020 |
| iPhone 12 Pro | 390 x 844 | 1170 x 2532 | 3.0 | 2020 |
| iPhone 12 | 390 x 844 | 1170 x 2532 | 3.0 | 2020 |
| iPhone 12 mini | 375 x 812 | 1125 x 2436 | 3.0 | 2020 |
When designing for iPhone devices, it's crucial to understand the difference between viewport size and screen resolution: