HandyjarFind a tool

Device mockup generator

Put your screenshot in a generic device frame. Everything stays in your browser.

1. Add your screenshot

Choose the screenshot you want to frame.

PNG, JPEG, WebP and other browser-supported images.

No screenshot selected.

Device and canvas settings
2. Device
Orientation
Frame color
3. Background
4. Screenshot fit

Use a six-digit hex color, such as #FFFFFF.

Use a six-digit hex color, such as #FFFFFF.

Contain keeps the full screenshot with white letterboxing. Rounded screens clip corners.

Choose one screenshot to begin.

Preview

Inspect the actual PNG before you download.

Your device mockup will appear here.

Choose an image, set your style, then create a PNG.

No PNG created yet.

Output details

Choose a screenshot to see output dimensions.

Generic frames, drawn locally. Your original stays untouched. Transparent canvas areas use a checkerboard here; that pattern is not in the PNG. PNG output may be larger than your input.

How it works

  1. Add your screenshotChoose a local image from your device.
  2. Choose your optionsPick a frame, canvas, background and fit.
  3. Create and downloadInspect the actual PNG, then save it.

Your files stay on your device

Image decoding, compositing and PNG encoding run in your browser. The tool does not upload, log or store your image or filename.

Each result starts from the original decoded screenshot. One still frame is used for animations. Source orientation is applied; source metadata is not copied. Browser decoding and sRGB output can change wide-gamut or HDR colors.

Frequently asked questions

Does my screenshot get resized or cropped?

The device scales to fit inside the canvas padding. Contain scales your screenshot into the screen with white letterboxing. Cover fills the screen, cropping the center when aspect ratios differ. Rounded screens clip corner pixels in both modes. Pixel rounding can slightly alter the scaled aspect ratio. Output details show the actual screen and image dimensions.

Are these real product templates?

No. These are generic, flat phone, tablet, laptop and monitor frames drawn with Canvas. They do not represent a named product or its exact dimensions. Phone and tablet frames support portrait and landscape. Laptop and monitor screens stay landscape; changing orientation does not rotate your screenshot.

How does transparency work?

Transparent backgrounds keep alpha outside the device. The screen has a white backing, including letterboxing and transparent screenshot pixels. Solid and diagonal gradient backgrounds fill the whole canvas behind the device.

Which images and sizes can I use?

Choose a local PNG, JPEG, WebP or another image supported by your browser decoder. Filename extensions do not decide support. There is no fixed file-size or dimension cap; real browser canvas and memory limits apply. Dimensions must be positive whole pixels and padding must leave enough space to draw the frame and screen. Unsupported, damaged or unprocessable images show an error; try a smaller image or canvas after a resource failure.

Can I reset or cancel?

Reset style restores the default phone frame and 1200 × 900 canvas without changing your source. Changing settings removes the old download until you create a new PNG. Cancel & clear stops processing and releases the image. Choose another file at any time to replace it.

More image tools: Screenshot beautifier · Resize image · Crop image