Skip to content

labsDesign tools

Mockup Studio

Your screen, in a real photo.

Try it Mockup Studio (opens in a new tab)
Mockup Studio home page with a laptop mockup standing on a green block.

What it is

Turns a screenshot into a high-res mockup in the browser, as a real photo or a 3D device.

Who it is for

  • Designers preparing shots for a portfolio
  • Teams putting screens into a client deck
  • Anyone posting a product screen on social

How it works

  1. 01

    Drop a screenshot

    Drop a file, double-click the screen, or paste with Ctrl+V.

  2. 02

    Pick a photo or a 3D device

    Start from a real photo, or pose and light a 3D device.

  3. 03

    Export

    Download JPG, WebP or PNG, or copy it straight onto a Figma canvas.

Screens

  • The Mockup Studio editor with photo settings on the left, a laptop photo in the middle and a photo library on the right.
  • The two modes side by side, photo mockups and the 3D studio.
  • Mockup Studio home page on a phone, with the Make a mockup button.
← All products