Device Mockup Generator

Drop a screenshot and instantly see it on a phone, laptop, tablet, desktop monitor, browser window or smartwatch, ready for your website, app store page or social posts.

NewFreeNo upload8 devices
1Add your screen imageCtrl+V to paste
screen.png
Second screen (optional)Shown on the phone. Leave empty to reuse the first image.
2Device
Layout
Device
Phone style
Frame colour
Screen
3Scene
Shadow
3D perspective
Canvas size

How to use Device Mockup Generator

  1. 1

    Add your screenshot

    Drop, paste or choose an app screen, website capture or design.

  2. 2

    Pick a device and scene

    Choose a single device or a combo such as laptop + phone or three phones, set the frame colour, background, shadow and 3D tilt.

  3. 3

    Download

    Export a high-resolution PNG (with transparent background if you like), JPG or WEBP up to 4200 px wide.

Free device mockups in seconds

Mockups make your product look real. Instead of sharing a flat screenshot, show it on a phone, a laptop or a desktop screen, the way it appears on landing pages, in pitch decks, app store listings and launch posts. This mockup generator runs entirely in your browser, so unreleased designs never leave your device.

Devices and layouts

  • Phone with a modern pill-shaped camera cut-out and an Android-style phone with a punch-hole camera.
  • Tablet in landscape or tall (portrait) orientation.
  • Laptop and desktop monitor with stand, ideal for websites and SaaS dashboards.
  • Browser window with your own address bar text.
  • Smartwatch for watch apps and widgets.
  • Combos: laptop + phone, desktop + phone, tablet + phone and three phones side by side. Add a second screenshot to show a different screen on the phone.

All device frames are drawn by us as generic, brand-free designs, so you can use the images in commercial projects.

Make it look like a product shot

  • Frame colours: midnight, silver, gold, blue, green, purple, white, red, pink or any custom colour.
  • Backgrounds: 18 gradients and mesh gradients, solid colours, a custom gradient, a blurred version of your screenshot or a transparent background.
  • Shadows and 3D: soft, strong, floating or floor shadows, a 3D perspective turn and rotation.
  • Screen fit: fill the screen, fit the whole image, or align a long page to the top, with a subtle glass reflection.
  • Canvas sizes: auto, 16:9, 4:3, 3:2, 1:1, 4:5, 9:16 and 1.91:1 for every social network.

Tips

  • Use a screenshot with the same aspect ratio as the device screen, for example a phone screenshot for the phone, for a perfect fit.
  • For long web pages, choose Align top so the header is visible.
  • Export PNG with a transparent background to place the mockup on your own website or slide design.

Frequently asked questions

Are the mockups free for commercial use?
Yes. The device frames are generic designs drawn by us without brand logos, so you can use the images on websites, in app store listings, ads and presentations for free.
Is my screenshot uploaded?
No. The mockup is rendered entirely in your browser, so unreleased designs and private data stay on your device.
Can I export a mockup with a transparent background?
Yes. Choose Transparent in the Background tab and export PNG or WEBP.
Can I show different screens on the laptop and the phone?
Yes. Choose a combo layout and add a second screenshot. It is shown on the phone, while the first image appears on the larger device.
What resolution are the mockups?
Up to 4200 px on the longest side at 3×. For the sharpest result, use a high-resolution screenshot.
Which image size fits the phone screen best?
Any phone screenshot works. The screen uses a tall 9:19.5 shape, so a native phone screenshot fills it perfectly. Use Fit whole image for other shapes.

Related tools

Screenshot BeautifierInstagram StoryOG Image ResizerCollage Maker