Apple • SMARTPHONE • 6.1"
iPhone 15 Pro Viewport Size & CSS Resolution
The iPhone 15 Pro features a 6.1-inch Super Retina display with 393 x 852 CSS viewport pixels and 3x DPR. Use the interactive simulator and verified CSS media queries below for pixel-perfect responsive frontends.
CSS Viewport393 × 852px logical
Physical Screen1179 × 2556px native
Device Pixel Ratio3× DPRRetina scale
Aspect Ratio19.5:96.1"
Brand & YearAppleReleased 2023
Tailwind TierDefaultDefault Mobile (< 640px)
Interactive Display Canvas Simulator
Simulates iPhone 15 Pro canvas proportion (393 × 852 CSS px)
9:41100%
iPhone 15 Pro393 × 852 px
DPR: 3x
19.5:9
Responsive Viewport
Ready-to-Use Developer Snippets
@media screen and (max-width: 393px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait)
Frontend Design Best Practices
- Test layouts with both Dynamic Island expanded and compact states.
- Check horizontal scrolling overflows on small cards.
CSS Viewport Specification
CSS Logical Width393 px
CSS Logical Height852 px
Hardware Native Width1179 px
Hardware Native Height2556 px
Pixel Density (DPR)3×
Aspect Ratio19.5:9
Frequently Asked Questions About iPhone 15 Pro Screen Dimensions
Frequently Asked Questions
Frequently Asked Questions
Everything you need to know regarding specifications, syntax, and security best practices.
Target 393px width for mobile portrait layouts and 852px width for landscape.