This page is set up for app screenshots on a phone: upload a screenshot and you get a 3D phone in the tilted "hero" pose on a light studio background, with a soft shadow and a faint reflection on the glass, ready for a landing page or an app store listing.
How to make a phone mockup
- Take the screenshot on the phone itself, or export the screen from your design tool at full size. A screenshot with the usual tall phone shape fills the display exactly.
- Upload it. PNG keeps small text sharpest; JPEG and WebP work too.
- Pick the angle (tilted hero, front, three-quarter left or right, or flat from above) and the colour of the phone.
- Choose a background. Transparent gives a PNG you can place on any colour, with the shadow kept as a soft semi-transparent layer.
- Download the picture, or switch Output to Animation for a looping video of the phone floating, swinging or spinning to show its back.
Landscape screenshots and videos
Wide content, such as a game or a video, turns the phone sideways automatically. Set Orientation to Portrait or Landscape to force one. A screen recording plays on the screen of an animation; pictures show a frame from its start.
Common pitfalls
- Part of the screenshot is missing. A screenshot that is shorter or wider than the phone's screen is cropped to fill it; tall ones keep their top. Choose Fit inside to see all of it with black bars.
- The status bar looks cramped next to the camera. The phone has a small punch-hole camera at the top of the display, as many current phones do. Screenshots taken on a phone already leave room for it.
- Colours shift slightly across the screen. That is the studio reflection on the glass: a little lighter where it catches the light, a little darker elsewhere. Set Reflection on the screen glass to Subtle or None under More options.
More about what this tool reads and writes: 3D Device Mockup Generator.