Quick Answer
A device frame generator wraps a plain screenshot in a realistic device mockup — an iPhone with a dynamic island, an Android with a punch-hole camera, a MacBook with a notch and keyboard, or a browser window with a URL bar — so it looks like a real app or website running on real hardware. Our free online version draws every frame programmatically on a canvas: upload or paste a screenshot, pick a frame and background, tune padding and shadow, then download a high-resolution PNG — all inside your browser, so the screenshot is never uploaded anywhere.
How It Works
Add your screenshot: upload a PNG/JPEG/WebP, drag one in, or paste straight from the clipboard with Ctrl/Cmd+V
Pick a frame: iPhone with a dynamic island, Android with a punch-hole camera, MacBook with a notch and keyboard deck, or a browser window with a URL bar — every frame is drawn on canvas, never downloaded
Style it: choose a gradient or solid background, then tune padding, device corner radius, drop shadow, and how far the screenshot zooms out inside the screen — everything previews live
Download the finished mockup as a 1× or 2× PNG, or copy it straight to your clipboard — nothing is ever uploaded
Key Facts
- Four frames drawn programmatically on canvas: iPhone (dynamic island), Android (punch-hole camera), MacBook (notch + keyboard), and a browser window (traffic lights + URL bar)
- Upload a PNG, JPEG, or WebP screenshot — or just paste it from your clipboard (Ctrl/Cmd+V)
- Eight gradient and solid background presets plus two fully custom gradient colors
- Adjustable padding, device corner radius, drop shadow blur and opacity, and export scale
- Screenshot scale slider shrinks the shot to 50–100% inside the device screen for a zoomed-out look
- The screenshot is contain-fitted and centered in the device screen — no stretching, no cropping
- Download as a 1× or 2× PNG or copy straight to your clipboard — free, no sign-up, no watermarks
- 100% client-side: frames are drawn with JavaScript canvas code, not external images, and nothing is uploaded
Frequently Asked Questions
How do I put my screenshot inside an iPhone frame?
Upload or paste your screenshot, choose the iPhone frame, and the tool instantly wraps it in a phone body with a black bezel, rounded screen corners, and a dynamic-island pill at the top. Your screenshot is contain-fitted to the screen so it never stretches or crops. Pick a background gradient, tune the padding and shadow, then download the finished PNG.
Is this device frame generator free?
Completely free with no sign-up, no credits, no watermarks, and no limits. Every frame — iPhone, Android, MacBook, and browser — is available at full quality, and you can generate and export as many mockups as you like. Paid mockup tools charge monthly subscriptions for the same canvas compositing that runs here in your browser.
Is my screenshot private?
Yes. The generator runs entirely in your browser with JavaScript and canvas drawing — your screenshot is never uploaded to a server, stored, or seen by anyone but you. Even the device frames are drawn with code instead of downloaded images. You can disconnect from the internet after the page loads and it keeps working.
What sizes does it export?
Mockups export as PNG at 1× or 2× the logical canvas size. The canvas automatically sizes itself to the chosen device plus your padding, so an iPhone mockup at 2× with default settings is roughly 1140 pixels wide, while a MacBook or browser mockup is much wider. The 2× option gives you crisp, retina-quality images for blog posts, landing pages, and app store listings.
Which devices and frames are supported?
Four frames: an iPhone-style phone with a chunky bezel and dynamic island, an Android-style phone with a thinner bezel and centered punch-hole camera, a MacBook-style laptop with a screen notch and a keyboard deck, and a browser window with traffic-light buttons and a URL bar. The phone and laptop screens are contain-fitted, so any aspect-ratio screenshot works — landscape web screenshots look best in the MacBook or browser frames.