Platform Specifications
6 platforms • Screen sizes, safe areas, and more
Guidelines for iPhone applications
Screen Sizes
| Device | Width | Height | Scale | Diagonal |
|---|---|---|---|---|
| iPhone 15 Pro Max | 3x | 6.7" | ||
| iPhone 15 Pro | 3x | 6.1" | ||
| iPhone 15 Plus | 3x | 6.7" | ||
| iPhone 15 | 3x | 6.1" | ||
| iPhone 14 Pro Max | 3x | 6.7" | ||
| iPhone 14 Pro | 3x | 6.1" | ||
| iPhone 14 Plus | 3x | 6.7" | ||
| iPhone 14 | 3x | 6.1" | ||
| iPhone SE (3rd gen) | 2x | 4.7" | ||
| iPhone 13/13 Pro | 3x | 6.1" | ||
| iPhone 13 mini | 3x | 5.4" |
Safe Areas
Top (Dynamic Island)
iPhone 14 Pro and later
Top (Notch)
iPhone X through iPhone 14
Top (Standard)
iPhone SE and earlier
Bottom (Home Indicator)
Face ID devices
Bottom (Home Button)
Touch ID devices
Left (Landscape)
Notch/Dynamic Island devices
Right (Landscape)
Notch/Dynamic Island devices
Layout Margins
Standard (Compact)
Default margins for compact width
Standard (Regular)
Default margins for regular width
Readable Content
Optimized for reading long-form text
Table View Cells
Leading/trailing insets
Card Content
Internal padding for cards
Component Heights
| Component | Height | Context |
|---|---|---|
| Status Bar | Dynamic Island devices | |
| Status Bar | Notch devices | |
| Status Bar | Home Button devices | |
| Navigation Bar (Large Title) | — | |
| Navigation Bar (Standard) | — | |
| Navigation Bar (Landscape) | — | |
| Tab Bar | Without safe area | |
| Tab Bar (with safe area) | Face ID devices | |
| Toolbar | — | |
| Search Bar | — | |
| Keyboard (Portrait) | iPhone 15 Pro | |
| Keyboard (Landscape) | iPhone 15 Pro |
Interaction Patterns
•Tap for primary actions
•Long press for context menus (3D Touch deprecated)
•Swipe left/right for actions on list items
•Swipe from edge for navigation (back gesture)
•Pull down to refresh content
•Pinch to zoom images and maps
•Two-finger scroll in nested scroll views
•Shake to undo
•Double-tap to zoom
Design Principles
1
Clarity: Text is legible, icons are precise, adornments are subtle
2
Deference: Fluid motion and crisp interface help users understand content
3
Depth: Visual layers and realistic motion impart vitality