Free MockupsOpen Editornew
Devices MockupsAll2740iPhone Mockup997MacBook Mockups370Apple Watch Mockups97iPad Mockups252
Laptop Mockups480
Android Mockups672
iMac Mockups68
Phone Mockups1489
3D Mockups0
Longscroll Mockups0
Clay Mockups654
Animated Mockups549
Apple Mockups1616
Computer Mockups338
Display XDR Mockups25
iOS Mockups1276
MacOS Mockups269
Microsoft Mockups39
Samsung Mockups229
Tablet Mockups370
Studio Display Mockups43
Website Mockups406
Branding MockupsAll1638T-Shirt Mockups43Packaging Mockups312Billboard Mockup144Business Card Mockup197
Hoodie Mockup38
Box Mockups64
Print Mockups952
Magazine Mockups112
Poster Mockup306
Paper Mockups323
Book Mockups79
Apparel Mockups61
Envelope Mockup88
Cosmetic Mockups48
Brochure Mockups28
Sticker Mockup153
Bag Mockups46
Folder Mockups81
Greeting Card Mockups18
ID Card Mockups14
Postcard Mockups18
Outdoor Mockups149
Paper Mockups163
Notepad Mockups15
Promotional Mockups299
Stationery Mockups588
Tin Box Mockups9
Wall Mockups130
Credit Card Mockups1
Can Mockups24
Tin Can Mockups12
Banner Mockups134
Bottle Mockups31
Clothing Mockups27
Flyer Mockups96
Food Package Mockups124
Frame Mockups59
Label Tag Mockups7
Letterhead Mockups12
Menu Mockups7
Mug Mockups12
Newspaper Mockups3
Pouch Mockups26
Sign Mockups96
WindowsOS Mockups102
Vector Illustrations549
Cup Mockups44
Duct Tape Mockups21
Other ProductsAbstractions607Illustrations724UI Tools4Animated Mockups542Bundles3
Abstractions342
AI generated100
Figma Mockups852
Free Photoshop Mockups894
Google Mockups86
Scene Generators24
Sketch Mockups583
UI/UX Tools4

Guides

Short how-tos for the ls.graphics mockup editors: put your design in, make it move, export it.

Static mockup editor

Photo mockups in the browser: drop a design in, export a picture.

Open the editor
The Composition menu with the 1:1 preset selected, the 1:1 ratio button above it, the phone on the canvas and the Copy and Export buttons beside itThe Composition menu with the 1:1 preset selected, the 1:1 ratio button above it, the phone on the canvas and the Copy and Export buttons beside itChange canvas aspect ratioSwitch your mockup from a landscape composition to a square canvas in three simple steps.1 minA textless green ring design on the iPhone screen, with its thumbnail filled in the Media section of the right panelA textless green ring design on the iPhone screen, with its thumbnail filled in the Media section of the right panelCreate a mockup onlineHow to create a mockup in the browser — choose a 3D-rendered scene, add your design and download a PNG.2 minThe Linear color picker next to the canvas, where a blue-to-orange gradient has handles on the backdropThe Linear color picker next to the canvas, where a blue-to-orange gradient has handles on the backdropPaint a gradient backgroundTurn a flat backdrop into a gradient. Switch the fill to Linear, set the end color and drag the handles on the canvas.2 minThe open Category menu with Branding Mockups and Devices Mockups, next to the search field and the Free only switchThe open Category menu with Branding Mockups and Devices Mockups, next to the search field and the Free only switchFind the right mockupSearch 3,800+ scenes, narrow them by category, and show only the free ones.2 minA phone with an orange frame and a design on its screen, with three color swatches above the canvasA phone with an orange frame and a design on its screen, with three color swatches above the canvasChange the mockup colorSwitch a phone to another color version with the swatches above the canvas, then add your design.1 minThe EU and US switch above the canvas with US selected, next to the 4:3 button and the right panelThe EU and US switch above the canvas with US selected, next to the 4:3 button and the right panelSwitch between EU and US sizesSome print mockups come in regional sizes. Switch between EU and US, then add a design that fits the size you chose.1 minThe Adjust media window with the Tile tab selected and a repeating pattern in its preview, over a billboard that already shows the patternThe Adjust media window with the Tile tab selected and a repeating pattern in its preview, over a billboard that already shows the patternTile a pattern on a screenRepeat a small image across a whole surface instead of stretching it. Add the picture, switch to the Tile tab and set the size of each repeat.2 minThe Effects section with Grain set to 0.08 and Vignette set to 0.7, beside a grainy orange scene with darker cornersThe Effects section with Grain set to 0.08 and Vignette set to 0.7, beside a grainy orange scene with darker cornersAdd grain and a vignetteGive a clean render a film look. Add grain for texture and a vignette to darken the edges, compare the result with the original, and reset it in one click.2 minThe laptop mockup on a pink background, beside the Change color row showing the hex F2C4B8The laptop mockup on a pink background, beside the Change color row showing the hex F2C4B8Recolor the backgroundMatch the backdrop of your mockup to your brand with a hex color, and reset it with one click.1 minA candle mockup with a small focus ring on the flame: the flame and rim are sharp, the leaf, label and table are soft, and the Blur row reads 120A candle mockup with a small focus ring on the flame: the flame and rim are sharp, the leaf, label and table are soft, and the Blur row reads 120Blur with a focus pointKeep one spot of your mockup sharp and blur the rest for depth. Place the focus, drag it onto your subject and raise the blur.2 minThe Curves graph bent into an S shape with two added points, beside the high-contrast watch scene it was applied toThe Curves graph bent into an S shape with two added points, beside the high-contrast watch scene it was applied toTune tones with CurvesBrighten, darken or add contrast with the Curves graph. Add points to the line, drag them, and reset the graph when you want to start over.2 minThe Media section with two design thumbnails, next to the envelope mockup showing the first designThe Media section with two design thumbnails, next to the envelope mockup showing the first designAdd designs to several screensPut a different design on each screen of a mockup, replace one later, or take a design off to bring back the empty screen.2 minThe Color balance panel on the Highlights tab next to a mockup whose light areas turned warm cream while the denim stayed blueThe Color balance panel on the Highlights tab next to a mockup whose light areas turned warm cream while the denim stayed blueBalance colors by toneWarm the highlights and cool the shadows with three sliders. Color balance tints each tone range of your mockup on its own.2 minA mailer with purple and aqua rings on a red-orange background after Hue 60 and Saturation 40, beside the Hue / Saturation panelA mailer with purple and aqua rings on a red-orange background after Hue 60 and Saturation 40, beside the Hue / Saturation panelAdjust hue and saturationShift every color in your mockup, make it more or less vivid, or tint the whole picture in one hue.2 minThe Export Image window with PSD selected over a matchbox mockupThe Export Image window with PSD selected over a matchbox mockupExport a layered PSDDownload your mockup as a layered PSD to keep editing in Photoshop, or as an SVG for vector work.2 minThe Export Video dialog with MP4 selected, over two iPad screensThe Export Video dialog with MP4 selected, over two iPad screensPlay a video on a screenPut a video clip on a device screen, scrub the timeline, and export the result as an MP4 or WebM video.2 minThe Adjust media window with the design zoomed to 150% inside the screen frame, with the rotate buttons and the Scale fieldThe Adjust media window with the design zoomed to 150% inside the screen frame, with the rotate buttons and the Scale fieldCrop, rotate and scale mediaZoom in on your design, move it inside the screen, and turn it a quarter turn, all from the Adjust media window.2 minAdjust media next to Adjust Backdrop with Paddings, Round Corners, Shadow and the wallpaper presetsAdjust media next to Adjust Backdrop with Paddings, Round Corners, Shadow and the wallpaper presetsFit a design on a backdropShow your whole design on the screen with padding, rounded corners, a shadow and a wallpaper behind it.2 min

Live Mockups

Real 3D devices you turn, light and animate.

Open the editor
The Saved tab in Live Mockups with the newest thumbnail outlined, next to the reopened MacBook scene turned at an angleThe Saved tab in Live Mockups with the newest thumbnail outlined, next to the reopened MacBook scene turned at an angleSave a scene and reopen itTurn your 3D scene, put your design on the screen, save it, then bring it back from the Saved tab whenever you need it.2 minAn iPhone mockup on a bent tube lit in pink, with the Lights and HDR sections beside itAn iPhone mockup on a bent tube lit in pink, with the Lights and HDR sections beside itRelight the sceneRaise a lamp, type your brand color for it, and turn the environment light up or down to change how the phone catches the light.3 minThe Background panel with the Transparent switch on and a checkerboard canvas behind an iPad Pro mockup and floating rocksThe Background panel with the Transparent switch on and a checkerboard canvas behind an iPad Pro mockup and floating rocksMake a transparent WebMSwitch on Transparent in Live Mockups and export a WebM of your animated mockup that you can place over any page or video.2 minThe Background panel with a new layer set to 2B4C7E at 100 percent opacity over a blue backdrop behind a MacBookThe Background panel with a new layer set to 2B4C7E at 100 percent opacity over a blue backdrop behind a MacBookChange the backdropPut a solid color behind your device, or tint the scene’s own backdrop, with a new layer in the Background panel of Live Mockups.2 minA phone hanging from an orange cord with a glass sheen and pixel grid on its screen, beside the Screen effects rowsA phone hanging from an orange cord with a glass sheen and pixel grid on its screen, beside the Screen effects rowsAdd screen effectsGive the display of a 3D phone a glass look in Live Mockups. Set Reflection, CRT and Opacity in Screen effects and watch the scene update.2 minA MacBook with a sharp screen, a soft background, film grain and dark corners, beside the Effects rows with Blur 80, Grain 0.1 and Vignette 1A MacBook with a sharp screen, a soft background, film grain and dark corners, beside the Effects rows with Blur 80, Grain 0.1 and Vignette 1Add blur, grain and vignetteGive a 3D laptop scene depth and a film finish in Live Mockups. Blur the scene around a sharp point, then add grain for texture and a vignette for dark edges.3 minA phone on a warm cream backdrop with the Tone mapping menu set to AgXToneMappingA phone on a warm cream backdrop with the Tone mapping menu set to AgXToneMappingGrade the colorsWarm, enrich and deepen the render of a live 3D phone scene with the Post processing sliders, then change its overall look with Tone mapping.3 miniPhone cards in the Scenes tab, one outlined, beside a 3D iPhone on the canvasiPhone cards in the Scenes tab, one outlined, beside a 3D iPhone on the canvasStart with a 3D scenePick a 3D device in Live Mockups on ls.graphics, play its built-in animation and turn it with your mouse.2 minThe Adjust media window with a design preview and the Scale field, over an iPad on the canvasThe Adjust media window with a design preview and the Scale field, over an iPad on the canvasPut your design on the screenReplace the picture on a device screen in Live Mockups, zoom it with Scale, and carry it to other scenes with one switch.2 minA MacBook turned on the canvas, with the Hand tool, the Reset view button and the 4:3 button above itA MacBook turned on the canvas, with the Hand tool, the Reset view button and the 4:3 button above itTurn and zoom the mockupOrbit the device with the Hand tool, scroll to zoom, hold Space to slide the view, and reset it with one click in Live Mockups.2 minThe Camera section with Zoom, Lens and Distance sliders beside a 3D iPhone on the canvasThe Camera section with Zoom, Lens and Distance sliders beside a 3D iPhone on the canvasFrame the shot with CameraUse Zoom, Lens and Distance in the Camera section of Live Mockups to frame a 3D device closer or wider, then reset with one button.1 minA MacBook half open on the canvas with the Play, Back to start and Loop buttons and the playhead belowA MacBook half open on the canvas with the Play, Back to start and Loop buttons and the playhead belowControl the animationPlay the built-in motion of a 3D scene in Live Mockups, jump to any moment on the timeline, loop it and change its speed.2 minThe Export window in Live Mockups with MP4 selected, 60 fps, two options and the Export Video buttonThe Export window in Live Mockups with MP4 selected, 60 fps, two options and the Export Video buttonExport an MP4 videoPick a canvas shape, then export your Live Mockups scene as an MP4 video you can post or send.2 min