Free MockupsOpen Editornew
Devices MockupsAll2693iPhone Mockup997MacBook Mockups367Apple Watch Mockups97iPad Mockups247
Laptop Mockups477
Android Mockups639
iMac Mockups68
Phone Mockups1472
Longscroll Mockups0
Clay Mockups654
Animated Mockups537
Apple Mockups1602
Computer Mockups335
Display XDR Mockups25
iOS Mockups1276
MacOS Mockups266
Microsoft Mockups39
Samsung Mockups213
Tablet Mockups365
Studio Display Mockups43
Website Mockups405
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 Mockups530Bundles3
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 your first mockupChoose a scene, add your design, and download your first mockup as 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 saved scene selected and its canvas next to itThe Saved tab in Live Mockups with the newest saved scene selected and its canvas next to itSave a scene and reopen itSave your 3D scene with your design on the screen, then bring it back from the Saved tab whenever you need it.2 minA phone on a bent tube lit in pink, with the Lights and HDR rows beside itA phone on a bent tube lit in pink, with the Lights and HDR rows beside itRelight the sceneRaise a lamp, tint it to match your brand, and turn the environment light up or down to change how the device and its surroundings catch the light.3 minThe Background popover with the Transparent switch on and a checkerboard canvas behind an iPadThe Background popover with the Transparent switch on and a checkerboard canvas behind an iPadMake a transparent WebMRemove the backdrop 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 canvas behind a laptopThe Background panel with a new layer set to 2B4C7E at 100 percent opacity over a blue canvas behind a laptopChange the backdropPut a solid color behind your device, or tint the scene’s own backdrop, with a new layer in the Background panel.2 minA phone hanging from an orange cord with a reflection, a CRT texture and a dimmed display, beside the Screen effects rowsA phone hanging from an orange cord with a reflection, a CRT texture and a dimmed display, beside the Screen effects rowsAdd screen effectsGive the display of a 3D device a real glass look in Live Mockups. Add a reflection and a CRT pixel texture, then dim the screen, and watch each change on the moving scene.2 minA laptop with a sharp screen, a blurred background, film grain and dark corners, beside the Effects rows with Blur 80, Grain 0.1 and Vignette 1A laptop with a sharp screen, a blurred 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 background around a sharp point, then add grain for texture and a vignette to darken the edges.3 minTwo phones with a warm, muted grade and the Tone mapping menu set to AgXToneMappingTwo phones with a warm, muted grade and the Tone mapping menu set to AgXToneMappingGrade the colorsWarm, enrich and deepen the render of a live 3D scene with the Post processing sliders, then change its overall look with Tone mapping.3 minThe iPhone group of the scene list with one card selected, the Play button and the timeline below it, and part of the 3D phone on the canvasThe iPhone group of the scene list with one card selected, the Play button and the timeline below it, and part of the 3D phone on the canvasStart with a 3D scenePick a 3D device in Live Mockups, play its built-in animation, and turn it with your mouse.2 minThe Adjust media window with a design preview and the Scale field, next to the right panel and an iPad on the canvas that shows the same designThe Adjust media window with a design preview and the Scale field, next to the right panel and an iPad on the canvas that shows the same designPut your design on the screenReplace the picture on a device screen in Live Mockups, fit it, and keep it when you switch scenes.2 minA MacBook turned and zoomed on the canvas, with the Hand tool, the Reset view button and the 4:3 button in the bar above itA MacBook turned and zoomed on the canvas, with the Hand tool, the Reset view button and the 4:3 button in the bar above itTurn and zoom the mockupOrbit the device with the Hand tool, scroll to zoom, slide the view, then reset it in one click.2 minThe Camera section in the Live Mockups settings panel with the Zoom, Lens and Distance sliders and the Reset transformations button, next to a phone on the canvasThe Camera section in the Live Mockups settings panel with the Zoom, Lens and Distance sliders and the Reset transformations button, next to a phone on the canvasFrame the shot with CameraUse Zoom, Lens and Distance to get a closer or wider look at your 3D device, then reset everything with one button.1 minA laptop half open on the canvas with the Play, Back to start and Loop buttons and the timeline playhead below itA laptop half open on the canvas with the Play, Back to start and Loop buttons and the timeline playhead below itControl the animationPlay the built-in motion of a 3D scene, jump to any moment on the timeline, loop it and change its speed.2 minThe Export window in Live Mockups with the MP4 and WebM tabs, the Watermark and Extend to video length options and the Export Video buttonThe Export window in Live Mockups with the MP4 and WebM tabs, the Watermark and Extend to video length options and the Export Video buttonExport an MP4 videoPick a canvas shape, then export your live 3D scene as an MP4 video you can post or send.2 min