iPhone 17 mockup you can fill in the browser
Say iPhone and most people picture this size. Place a screen inside a frame drawn for the 402 × 874 pt display and download it at whichever scale you need.
The maker is loading. It needs JavaScript and does all of its work on your own device.
iPhone 17, measured and drawn
| Display in points | 402 × 874 pt |
|---|---|
| Display in pixels | 1206 × 2622 px at 3x |
| Density | 460 ppi |
| Proportion | 2.17:1 |
| Rounding of the glass corners | 62 pt (186 px) |
| Camera cut-out we paint | Dynamic Island, 126 × 37 pt |
| Upright safe area | top 62 pt, bottom 34 pt |
| Strip along the top edge | 54 pt |
| Drawn black border, then metal edge | 3.4 pt and 1.8 pt |
| Drawn body, no buttons | 412.4 × 884.4 pt |
| Drawn body plus side keys | 417.2 × 884.4 pt |
| Bare frame at 1x | 417 × 884 px |
| Bare frame at 2x | 834 × 1769 px |
| Bare frame at 3x | 1252 × 2653 px |
| Ready canvas at 3x with 10% of padding | 1782 × 3184 px |
| Shares its pixel grid with | iPhone 18 Pro, iPhone 17 Pro and iPhone 16 Pro |
| File types | PNG keeps transparency, JPEG does not |
The display figures follow the device profiles in Xcode and the iOS Simulator. The frame figures are our own drawing.
Canvas sizes worth exporting for iPhone 17
| Purpose | Wide | Tall |
|---|---|---|
| Bare frame at 2x Blog header or newsletter image | 834 px | 1769 px |
| Native 3x Sharpest option for print or a slide | 1252 px | 2653 px |
| Large store slot Frame on a 6.9 inch store canvas | 1290 px | 2796 px |
Row one is the bare frame at that scale. The rest are finished canvases: apply the padding and tilt in the note, then set the PNG on a backdrop of that size.
One source file for the listing, the deck and the page
The iPhone 17 display is 1206 × 2622 pixels. App Store Connect asks for a set of screenshots on the medium Dynamic Island display and accepts 1206 × 2622 in that slot. If your mockup starts from the same capture, the store listing, the slide and the web page all come from one file, and nothing gets resampled between them.
Width is where this model parts from the one before it. The glass is 402 pt across, nine points more than the 393 pt that designers have used as a base for years, while the safe area keeps 62 pt above and 34 pt below. A design built on a 393 pt phone deserves a look at the edges after you drop it in. Fill crops to the glass, Fit leaves the whole picture on black, and Stretch bends the proportions, so reach for it only on purpose.
Numbers behind the drawing
Our frame wraps the glass in a black border of 3.4 pt and a metal edge of 1.8 pt, giving a body of 412.4 × 884.4 pt. That exports at 834 × 1769 px for 2x and 1252 × 2653 px for 3x. The glass corners are rounded at 62 pt, and the Dynamic Island is a 126 × 37 pt pill, the collapsed size as measured on a 393 pt phone.
The five finishes are black, lavender, sage, rose and deep blue, colors and names of our own making. Choose one that stands apart from the backdrop. Lavender on a lavender gradient dissolves, whereas black on a pale gradient earns a crisp outline.
Typical jobs for it
Launch posts, case study covers, a handout where a teacher points at one step on screen, a title card in a short video. Whatever the job, the result is a picture of a screen and nothing more, so say so whenever the context could mislead a viewer. A caption such as sample screen is enough.
Quick answers
What are the iPhone 17 screen dimensions?
402 × 874 points, or 1206 × 2622 pixels at 3x, with glass corners of 62 pt in Xcode's device profile.
Which phones use the same pixel size?
iPhone 18 Pro, iPhone 17 Pro and iPhone 16 Pro. All of them render 1206 × 2622 pixels, so a single capture can serve every one.
How do I get a transparent background?
Pick Transparent under Background. The PNG keeps its alpha channel, and the soft shadow stays around the body unless you turn it off.
Does it work from a phone?
Yes. On a narrow screen the controls stack beneath the preview, and the file picker can open your photo library.
Other frames to try
- iPhone 17 Pro Max mockup in your browserThe tallest iPhone canvas in our set, 440 × 956 pt.
- iPhone 16 mockup, built in the browserThe 393 pt phone behind a great many tutorials and listings.
- Crypto wallet app mockup on a phoneA lavender sample wallet screen on a drawn iPhone.
- Every device pageThe whole set in one list: five iPhone frames, an iPad, an Android phone, a MacBook, a transparent-PNG page and a wallet-app screen.
- Larp wallpapers, sized for iPhone and MacJPEG backgrounds cut to the pixel grid of each iPhone. They are mockups, never proof.
- Screenshot size calculator for the App StoreChoose a device and read off the screenshot sizes App Store Connect takes.
The maker comes from Flexdger Wallet, a crypto wallet mockup that runs in the browser: you choose the balance, the tokens, the name and the avatar, prices are live, and nothing gets installed. This maker needs no account, and whatever it exports is a picture of a screen, never proof of funds.
Not affiliated with Apple, Samsung or Google. The names iPhone, iPad and MacBook belong to Apple Inc., and Samsung and Google own theirs. Each frame on this page is our own drawing, traced from published screen sizes and never taken from a manufacturer's artwork.