Choose the visual job you need to finish.
In-depth mockup generators for devices, app stores, social posts and email, with current platform sizes and a launch-graphics playbook, built around real screenshots.
Each page answers a distinct generator, platform, reference, or product-marketing job. Use the directory to find the closest workflow rather than a renamed version of the same advice.
Product & device generators
Presentation workflows for websites, products, interfaces, and responsive screens across physical devices.
device mockup generator
MockupX puts a screenshot inside a real device frame in the browser: iPhone 17, 17 Pro, 17 Pro Max and Air, Google Pixel 7 Pro, Nothing Phone, five iPads, four MacBooks, Apple Studio Display, Studio Display XDR, iMac and three Apple Watch sizes, plus Safari and Chrome browser toolbars and a frameless mode. This page lists every frame with its exact screen opening, explains which capture fits which frame, and covers the details that make a device mockup look wrong: a notch over the menu, a stretched screenshot, a shadow clipped by the canvas edge.
Open this page →Generator workflowMacBook mockup
Most MacBook mockups are Photoshop files you download, open and edit through a smart object. MockupX skips that step: choose a MacBook Air or MacBook Pro M5 frame, drop in a screenshot, and export the finished image from the browser. This page covers the four frames and their exact screen sizes, the capture shape that fills them without bands, the notch, and which canvas to use for slides, launch pages, social posts and the Mac App Store.
Open this page →Generator workflowiPad mockup
An iPad mockup shows that your product works on a tablet and gives a dense interface more room than a phone. MockupX includes iPad Pro, iPad Air and iPad mini frames in their current finishes, each in portrait and landscape. This page lists their exact screen sizes, the browser viewport that produces a matching web capture, how to choose an orientation, and how the frames line up with Apple's App Store iPad sizes.
Open this page →Generator workflowandroid mockup generator
MockupX has two Android frames: the Google Pixel 7 Pro in Obsidian, Snow and Hazel, and the Nothing Phone in Black and White, each in portrait and landscape. This page explains how to take a clean Android capture, which capture shape fits each frame, how to handle the punch-hole camera and navigation bar, and one thing many Android mockup pages leave out: Google advises against device frames in Play Store screenshots, so the framed version is for your website, deck and social posts, while the Play listing usually works better frameless.
Open this page →Generator workflowmulti device mockup generator
A multi-device image earns its space when each screen adds something: a step in a flow, a before and after, the same task on a phone and a tablet. MockupX builds two- and three-device compositions from real screenshots in the browser. This page explains exactly what the editor can put on one canvas, which layout suits which story, how to prepare captures that look like one set, and how to build a phone, tablet and laptop set when the devices are of different types.
Open this page →App store & social generators
Focused composition tools for store listings, campaign placements, social formats, and email previews.
Google Play screenshot generator
MockupX is a browser-based Play Store screenshot generator. Drop in a real Android capture, add a background and a short headline, and export at a Google Play preset such as 1080 × 1920 for phones. This page also works as a size and rules reference: every screenshot size Google lists for phones, tablets, Chromebooks, Wear OS, TV, Automotive and XR, what Google says about text and device frames, and a checklist to run before you upload. Requirements were checked against Google's Play Console Help page on preview assets in October 2026.
Open this page →Generator workflowGoogle Play feature graphic generator
The feature graphic is the wide banner at the top of a Google Play listing and the cover image for your preview video. It is a fixed 1024 × 500 image, and Google publishes specific advice about what belongs in it: keep the focal point centered, avoid pure white, black and dark gray, and leave out device imagery, rankings and prices. MockupX has a 1024 × 500 preset; this page explains the rules, a layout that follows them, and how to build and check the file. Requirements were checked against Google's Play Console Help page in October 2026.
Open this page →Generator workflowInstagram story mockup
A Story fills the phone screen, and then Instagram draws its own interface over it: progress bars and the account name at the top, the reply bar or a call-to-action button at the bottom. A good Story mockup is built around that. This page gives the sizes that matter, converts Meta's safe-zone percentages into pixels for the two common canvases, and shows how to place a product screenshot so it survives the overlays. MockupX has a 1080 × 1920 Story canvas, phone frames and Story templates built in.
Open this page →Generator workflowInstagram carousel mockup
A carousel is one post with up to 20 photos or videos that people swipe through. It is the best Instagram format for showing how a product works, because each slide can hold one step. It is also easy to get wrong: Instagram applies one orientation to every slide, crops anything that does not match, and shows the first slide alone in the feed. This page covers the slide sizes Instagram supports today, how to choose between them, and how to build a consistent set in MockupX.
Open this page →Generator workflowFacebook ad mockup
Meta runs one ad across Facebook and Instagram feeds, Stories, Reels, Marketplace and search, and each placement has its own shape. This page puts the current image specs from Meta's Ads Guide in one table, converts the Story safe zones into pixels, adds the organic Page sizes from the Facebook Help Center, and shows how to build feed, square and vertical versions of a product-screenshot ad in MockupX before you open Ads Manager.
Open this page →Generator workflowLinkedIn carousel mockup
On LinkedIn, the swipeable “carousel” most people mean is a document post: you upload a PDF or slide deck and LinkedIn shows it page by page in the feed. Carousel ads are a different format with different rules, and plain image posts are a third. This page covers all three with LinkedIn's own specs, then shows how to design consistent pages from product screenshots in MockupX and turn them into a PDF.
Open this page →Generator workflowTwitter post mockup
On X, the image does the work the 280 characters cannot: it shows the product. This page covers what X documents about images (formats, file size and how many per post), the canvases that work for product screenshots, how multi-image posts change the layout, and how to build the image in MockupX without wrapping it in fake post chrome. People still search for Twitter post mockups, so both names appear here; the platform is X.
Open this page →Generator workflowYouTube thumbnail mockup
A thumbnail is designed at full size and judged at a fraction of it, in a grid of other videos. For product videos (tutorials, demos, launch videos, webinars), the subject is usually an interface, which is the hardest thing to make legible when small. This page covers YouTube's current thumbnail specs, which changed from the long-quoted 1280 × 720, how to pick and crop one product moment, and how to build the thumbnail in MockupX.
Open this page →Generator workflowemail mockup generator
Take a screenshot of your email, from your email platform's preview, a test send or a design file, and MockupX puts it in a Safari or Chrome browser frame or on an iPhone or Android phone, on a background you choose, at the exact canvas size you need. Use it for client approvals, portfolio case studies, launch posts and “see what subscribers get” sections on a sign-up page. MockupX frames screenshots; it does not build, code or send email.
Open this page →Generator workflowPinterest pin mockup
Pinterest works more like a visual search engine than a feed: people look for ideas, save them, and click through later. For software and digital products, Pins that do well are useful on their own (a template preview, a checklist, a before-and-after) and lead to a page that delivers exactly that. This page covers Pinterest's own specs, the safe zone it publishes, a layout Pinterest recommends, and how to build Pins from screenshots in MockupX.
Open this page →Platform size references
Practical canvas guidance for common platform placements, with caveats where publisher requirements can change.
Product marketing workflows
Repeatable visual systems for launches, announcements, landing pages, sales, documentation, and release communication.
Looking for one of the original in-depth guides?
These five long-form guides cover App Store sizes, iPhone and browser mockups, Instagram posts and screenshot polish in depth.
Instagram post mockups
Build readable Instagram feed visuals without duplicating this established guide intent.
Read guide →App Store screenshot sizes
Check Apple screenshot dimensions and device-group planning before final export.
Read guide →iPhone mockup generator
Choose an iPhone frame, orientation, source image, and destination treatment.
Read guide →Browser mockup generator
Frame websites and web apps while keeping the interface in focus.
Read guide →Screenshot beautifier
Refine crop, spacing, background, frame, shadow, and export choices.
Read guide →Bring the screenshot you already have.
Open the editor, choose an appropriate canvas and frame, and export the visual your destination needs.