iPhone and iPad Mockups
Last Updated on August 7, 2026 by Editorial Team
A set of 6 Apple devices mockups that includes 4 x iPhone mockups (6/7 and SE) and 2 x iPad mockups. The freebie is available in three formats: .SVG, .Sketch and .XD.
Created by Zhenhua. Enjoy!
What makes this set of iPhone and iPad mockups stand out is the angle. Instead of laying the devices flat or standing them upright the way most mockup packs do, this collection tilts every phone and tablet on a diagonal, scattering them across a bright lime green backdrop like they’ve been tossed onto a table mid-photoshoot.
That diagonal composition gives the whole set energy. It reads more like a promotional poster or app store banner than a static product shot, which is exactly why it works so well for marketing contexts rather than plain documentation.
Both black and white iPhone bodies are included, covering the iPhone 6/7 and SE body styles side by side with two iPad mockups in the mix. Having both color options means you can match the device finish to whatever mood your screenshot or background calls for, dark for something moody or tech-forward, white for a cleaner, lighter feel.
The sample screens dropped into these mockups, a sports car and a rippling white fabric pattern, are just placeholders standing in for your own content. Swap them out for app interfaces, website screenshots, or product photography and the mockup does the rest.
Where This Set of iPhone and iPad Mockups Works Best
This is a strong pick for app store listing graphics, Dribbble and Behance shots, landing page hero sections, and social media promos where you want to show off a UI design without it looking like a boring flat screenshot.
Because several devices are grouped together at angles, it’s particularly good for showing responsive design across iPhone and iPad at once, letting you prove a design adapts across screen sizes in a single image.
It also suits pitch decks and case study pages where you’re presenting a mobile app or iOS interface to a client and want the presentation to feel considered rather than thrown together.
If you need a single, isolated device mockup for a simple app icon preview, this diagonal, multi-device layout might be more than you need. It shines when you want a fuller, more dynamic scene rather than one clean product shot.
Editing is straightforward in either Sketch or Adobe XD. Locate the screen layer or artboard inside each device, replace the placeholder image with your own screen design, and the perspective and device frame stay intact around it since the mockup is built to hold that content in place.
Because it’s also available as SVG, you have the flexibility to bring the device outlines into other vector tools if Sketch or XD isn’t your workflow, though you’ll want to check how the layered screen content translates when moving formats.
The lime green background is bold and very on-brand for a portfolio piece, but it’s easy enough to swap for a brand color, gradient, or neutral tone if you need the mockup to sit quietly behind a more corporate presentation.
Pair it with a clean sans-serif headline and a short line of supporting copy overlaid near the top or bottom of the composition, and you’ve got a ready-made hero banner for an app landing page or a portfolio case study cover without much extra design work.
