Transparent PNG · Free · Commercial use
Transparent background phone mockups
Not an empty device frame you still have to warp your screenshot into — a cut-out PNG with your screen already on the phone, at whatever angle you rotated it to. Free, no attribution, and yours to use commercially.
How to export one
- 1. Open the studio and drop your screenshot onto the device — PNG, JPEG, or WebP.
- 2. Pick the device and finish, then drag to orbit until the angle is the one you want.
- 3. Set the background to Transparent. The canvas switches to a checkerboard so you can see the cut-out.
- 4. Export. The format is forced to PNG, because a transparent background cannot survive JPEG — so the alpha channel is preserved instead of being silently flattened onto white.
Why not just download a stock PNG?
You can, and for a quick throwaway it is fine. But a stock transparent device PNG has two costs that only show up once you are using it.
The first is the angle. The file was rendered once, at one perspective. Getting your screenshot to sit convincingly inside it means a manual perspective warp, and the reflections and shadows still belong to the original render, not to your screen. Want the phone tilted differently? That is a different file, if it exists at all.
The second is the licence. Free stock device frames routinely come with personal-use-only terms, an attribution requirement, or a clause against redistributing the asset inside a client deliverable — the exact things you need when the shot is going into a paid ad or a handoff. Read the terms before the work ships, not after.
| Here | Typical stock PNG | |
|---|---|---|
| Your screenshot | Already composited on the screen | Empty frame — you warp it in yourself |
| Angle | Any — rotate the 3D device | Whatever it was rendered at |
| Lighting & shadow | Recomputed live for your angle | Baked into the file |
| Attribution | None required | Often required — check the licence |
| Commercial use | Allowed | Frequently restricted on free tiers |
Devices you can cut out
Each is modelled from its published millimetre dimensions, so the silhouette you cut out is the real one.
- iPhone 17 Pro mockup — 1206 × 2622 screen
- iPhone 17 Pro Max mockup — 1320 × 2868 screen
- iPhone Air mockup — 1260 × 2736 screen
- Galaxy S26 Ultra mockup — 1440 × 3120 screen
Where a cut-out earns its keep
- Landing-page heroes where the phone has to sit on a gradient, photo, or video the browser draws — not on a baked-in backdrop.
- Slide decks and pitch material, where the same device has to work on a light slide and a dark one.
- Figma and Photoshop compositions where you want to put things behind and in front of the device.
- Print and merchandise, where a background you did not choose is a reprint.
Questions that come up
- How do I get a phone mockup with a transparent background?
- Open the studio, drop your screenshot on the device, set the background to Transparent, and export. The export comes out as a PNG with a real alpha channel — the device, its shadow edges, and your screenshot are kept, and everything behind them is cut out. Because a transparent background cannot survive JPEG, the exporter forces PNG automatically rather than silently flattening your cut-out onto white.
- Can I use a transparent iPhone mockup PNG commercially without attribution?
- From here, yes — App Store listings, paid ads, client work, print, anything, with no licence to buy and no credit line required. That is worth checking wherever else you source one: most free transparent device PNGs come from stock libraries whose free tiers are personal-use only, require attribution, or forbid redistribution inside a client deliverable. The one thing nobody can grant you is Apple's or Samsung's hardware design and trademarks, which stay theirs exactly as they do with any mockup tool.
- What's the difference from a stock transparent device PNG?
- A stock PNG is an empty frame shot at one fixed angle: you still have to warp your screenshot into its perspective by hand, and if you need a different angle you need a different file. Here the device is real 3D geometry, so you rotate it to any angle you like and export with your screenshot already mapped onto the screen, lit and shadowed to match. You get a finished cut-out rather than a frame you still have to do the hard part of.
- Can I composite the exported PNG in Figma or Photoshop?
- That is what it is for. The exported PNG carries a straight alpha channel, so it drops onto any background in Figma, Sketch, Photoshop, Affinity, Canva, or a slide deck and composites cleanly with no halo or matte to clean up. Export at 4K if you plan to scale it up, since alpha edges are the first thing to show softness when a mockup is enlarged after the fact.
Need a background instead of a cut-out? The social media mockup and App Store screenshot pages cover the composed versions.