iPhone Mockup Generator
The GenDesigns iPhone Mockup Generator is a free browser tool that wraps your screenshot in an accurate iPhone frame. Upload a PNG, JPG or WebP, choose an iPhone 16 Pro, 16 Pro Max, 16, 15 or SE body, adjust the background, device color and shadow, then download a PNG at 1x, 2x or 3x. Nothing is sent to a server.
What size should an iPhone mockup be?
Design at 1x in points, export at 2x or 3x in pixels. Points are the logical units you lay out in; pixels are what the display actually renders. Every model below is drawn to these exact proportions by the generator above.
| Model | Screen | Points (1x) | Pixels |
|---|---|---|---|
| iPhone 16 Pro Max | 6.9" | 440 × 956 | 1320 × 2868 |
| iPhone 16 Pro | 6.3" | 402 × 874 | 1206 × 2622 |
| iPhone 16 | 6.1" | 393 × 852 | 1179 × 2556 |
| iPhone 15 | 6.1" | 393 × 852 | 1179 × 2556 |
| iPhone SE (3rd gen) | 4.7" | 375 × 667 | 750 × 1334 |
iPhone SE 3 is the outlier: no Dynamic Island, square screen corners, and 185 points less height than an iPhone 16. If a layout survives 667 points of vertical space it will survive anything else in the line-up. More on model choice and export targets in the full iPhone mockup guide.
This tool frames a screen. GenDesigns designs one.
The generator above needs a screenshot you already have. If you do not have one yet, describe the app instead and GenDesigns generates the screens themselves — onboarding, dashboards, settings — as HTML and Tailwind CSS sharing one theme you can keep editing. It is a paid product: plans start at $10/month, credits roll over instead of expiring, and you keep them if you cancel.
Generate app screens with GenDesignsFrequently Asked Questions
How do I make an iPhone mockup for free?
Upload a screenshot to the generator above, choose an iPhone model, adjust the background and shadow, then download the PNG. The whole thing runs in your browser: there is no account to create, no image is uploaded to a server, and nothing is watermarked. PNG, JPG and WebP files up to 15 MB are accepted.
What size should an iPhone mockup be?
Work at 1x in points and export at 2x or 3x pixels. iPhone 16 Pro Max is 440 x 956 points (1320 x 2868 pixels), iPhone 16 Pro is 402 x 874 points (1206 x 2622 pixels), iPhone 16 and iPhone 15 are both 393 x 852 points (1179 x 2556 pixels), and iPhone SE 3 is 375 x 667 points (750 x 1334 pixels).
Which iPhone should I design for?
iPhone 16 at 393 points wide and iPhone 16 Pro at 402 points wide sit in the middle of the current line-up, so either makes a safe primary target. Check the extremes afterwards: iPhone SE 3 at 375 points wide has no Dynamic Island and a much shorter 667-point screen, while iPhone 16 Pro Max gives you 956 points of height to fill.
Can I make an iPhone home screen mockup with this tool?
Yes. Screenshot any home screen on your phone, or export a home screen design from Figma, and drop the file into the generator. The frame never alters the pixels inside the screen, so your wallpaper, app grid, widgets and dock appear exactly as they were captured.
Do the exported mockups have a transparent background?
Yes, when you pick the Transparent background option. The PNG is written with a real alpha channel around the device, so it drops cleanly onto a landing page, a pitch deck slide or an App Store marketing image. Solid color and two-stop gradient backgrounds are available if you would rather bake one in.
Can this generator design the iPhone screen itself?
No. This tool frames a screenshot you already have. Generating the screens themselves from a written description, as HTML and Tailwind CSS you can theme and iterate on, is what GenDesigns does. GenDesigns is a paid product with plans starting at $10 per month.