iPhone

iPhone 17 vs iPhone 17 Pro: screen size for websites

Same viewport. The iPhone 17 and iPhone 17 Pro both give web pages 402 × 874 CSS pixels, so a site that fits one fits the other.

iPhone 17iPhone 17 Pro
CSS viewport402 × 874402 × 874
Visible on first load402 × 718 (Safari (iOS 26))402 × 718 (Safari (iOS 26))
Device pixel ratio33
Physical resolution1206 × 26221206 × 2622
Screen size6.3″6.3″
Aspect ratio19.6:919.6:9
Tailwind breakpointbase styles onlybase styles only
Bootstrap tierxsxs
Full-width image needs1206px1206px
Released20252025

See your site on both, side by side

Paste your address (or localhost:3000). doesitfit shows it on the iPhone 17 and iPhone 17 Pro at their exact sizes, next to each other.

Free, no sign-up. Or ask Claude, ChatGPT or Codex to check it.

What the difference means for your site

Width: 402px vs 402px

Identical, so text wraps in exactly the same places.

Height: 874px vs 874px

On first load a page shows 718px on the iPhone 17 and 718px on the iPhone 17 Pro, so “above the fold” is the same.

Questions people ask

Is the iPhone 17 screen bigger than the iPhone 17 Pro for websites?

Same viewport. The iPhone 17 and iPhone 17 Pro both give web pages 402 × 874 CSS pixels, so a site that fits one fits the other.

What are the viewport sizes of the iPhone 17 and iPhone 17 Pro?

iPhone 17: 402 × 874 CSS px (DPR 3). iPhone 17 Pro: 402 × 874 CSS px (DPR 3).

Do I need to test my site on both?

Not for layout: they share a viewport. Test once.

More comparisons