Free before and after slider maker
Slider, video and image from two photos

Drop a before photo and an after photo, drag the line to compare them, and save the result as a video for Reels and TikTok, an image for a listing, or a slider for your own website.

Everything is made in your browser, so the photos never leave your computer.

Free, no sign-up, no watermark. Your photos stay on your computer. The slider, images and video are made in this browser tab and the photos are never uploaded to us or anyone else.

Tablet showing a living room split down the middle, empty on the left and furnished on the right
  • Wipe video in MP4, square, portrait, vertical or landscape
  • Split or side by side images in full resolution
  • A slider for WordPress, Webflow or any website
How it works

How to make a before and after slider

3 steps, and the photos never leave your computer.

1. Add the two photos

Drop the before photo on the left box and the after photo on the right, or drop both at once. Take them from the same spot so the line lines up.

2. Compare and set up

Drag the line on the preview. Choose the format, change or hide the Before and After labels, and swap the photos if they are the wrong way round.

3. Download

Save a wipe video, an image with the line, a side by side image, or a slider for your website as a ZIP with the HTML and both photos.

What you get

A video, an image and a slider from the same two photos

Every output, and the settings that go with it.

Before and after video

The line sweeps across and back in 4 to 10 seconds and loops cleanly. Choose vertical 9:16 for Reels, TikTok and Stories, 4:5 or square for the feed, or 16:9 for YouTube and websites. MP4 where your browser can record it, otherwise WebM.

Before and after image

A JPG with the line where you leave it, or the two photos side by side (one above the other in the tall formats). Up to 4,096 pixels on the long side, so it holds up in print and on listing portals.

Slider for your website

A ZIP with index.html, before.jpg and after.jpg. The slider is plain HTML and CSS with one line of script: paste the block into WordPress, Webflow, Squarespace or Shopify as custom HTML and upload the two photos.

Labels and credit

Rename the labels to anything, for example Empty and Staged or 2019 and 2026, or switch them off. The small 3dstudio.co credit is on by default and goes away with one click.

Who uses it

Before and after for listings, renovations and renders

The jobs a before and after does best.

Estate agents

Show an empty room next to its staged version, or a tired kitchen next to the renovation it could have. A vertical video gets more views on Reels than two separate photos.

Renovation and interiors

Builders, kitchen fitters, painters and interior designers: put the job before and after on your website as a slider, and on social media as a video.

Architects and developers

Compare a site photo with the render of what will be built there, for planning presentations, sales pages and neighbours' information evenings.

Photo editing

Show a retouch, a colour grade, a sky replacement or an AI edit next to the original. The website slider lets clients judge the change themselves.

When you need the after photo

What we make for before and after

The after photo is the hard part. These are real virtual staging jobs from our team: drag each line to compare.

The empty apartment living room as photographed, with a balcony door and a pale wood floor, before virtual stagingThe same living room after virtual staging, with a corner sofa, a media unit, a television and a rattan pendant
BeforeAfter

Homes for sale and rent

Empty apartments and houses furnished in the photo, for listings and lettings.

See virtual staging
An empty meeting room with blue carpet, four tall windows and wall heaters, as photographed, FinlandThe same meeting room after virtual staging, with a long table, blue chairs, a whiteboard and plants
BeforeAfter

Offices and meeting rooms

Bare offices furnished so a leasing agent can show what the space is for.

See virtual staging for offices
A large empty shared area with a concrete floor and a raised platform at the back, as photographed, FinlandThe same area after virtual staging, with a long table, folders, blue chairs and a plant in the foreground
BeforeAfter

Shared and commercial spaces

Canteens, lounges and open floors shown in use before anyone moves in.

Get a virtual staging quote
Before and after FAQ

Questions about the before and after maker

Formats, the website slider, privacy and the credit.

Ask us a question
How do I make a before and after video for Instagram Reels?
Add the two photos, set the format to Vertical 9:16, choose a video length of 6 or 8 seconds and download the video. Upload it to Reels, TikTok or Stories as it is. For the feed, use Portrait 4:5 or Square.
How do I add a before and after slider to my website?
Choose Slider for your website and download the ZIP. Open index.html to see it working. Copy the block that starts with div class ba-slider into a custom HTML block in WordPress, Webflow, Squarespace or Shopify, and upload before.jpg and after.jpg to the same place, or change the two image addresses to where you uploaded them.
What if my two photos are different sizes?
The output takes its shape from the before photo, or from the format you choose, and both photos are cropped from the centre to fill it. For a clean line, take both photos from the same spot with the same zoom.
Is it really free, and is there a watermark?
It is free with no sign-up and no limit. A small 3dstudio.co credit is added in the corner by default; untick Add a small 3dstudio.co credit and it is gone.
Are my photos uploaded?
No. The photos are opened, drawn and saved in this browser tab on your own computer and are never sent to us or anyone else.
More free tools

Other free 3D and CAD tools

Each one runs in your browser, like this one.

Laptop showing a colour-coded 3D BIM model of a building cut open, with printed plans beside it

IFC viewer

Open IFC files from Revit, ArchiCAD and Tekla. Filter by element and level, check properties and measure.

Open the IFC viewer
Laptop showing a 3D model of a timber-clad apartment building, with a scale ruler beside it

Revit viewer

Open .rvt files without Revit: converted to IFC by Autodesk, then viewed with levels and properties.

Open the Revit viewer
Monitor showing a BIM model of an office building with steel in blue and ducts in orange, a white hard hat in front

BIM viewer

Review BIM models from Revit, Archicad and Tekla without a licence: levels, properties, measuring.

Open the BIM viewer
Laptop on an oak desk showing a CAD floor plan with coloured layers, next to a rolled drawing

DWG viewer

Open AutoCAD DWG and DXF drawings online: every layout, layers on and off, zoom and pan.

Open the DWG viewer
Laptop showing a CAD drawing of a mechanical part outline with coloured layers next to a laser-cut aluminium version of the part

DXF viewer

Open DXF files online: every layout, layers on and off, zoom, then save as PDF or SVG.

Open the DXF viewer
Printed architectural floor plan on a desk next to a laptop showing the same plan

DWG to PDF

Plot AutoCAD drawings to PDF: layouts 1:1 with title blocks, line weights and hatches.

Open DWG to PDF
Brick, stone and oak material samples in front of a monitor showing a purple and blue normal map

Normal map generator

Make normal, height, roughness and AO maps from any image, seamless if you need it.

Open the normal map generator
Printed architectural plan on a desk beside a laptop showing the same plan as coloured CAD lines

PDF to DWG

Turn PDF drawings into CAD lines for AutoCAD: lines, text and layers, at drawing scale.

Open PDF to DWG
Laser-cut birch plywood sign with a curved logo outline beside a laptop showing the same vector paths

SVG to DXF

Convert SVG to DXF for CAD, laser cutting and CNC: exact lines, layers, real size.

Open SVG to DXF
Black and white printed logo on paper next to a laser-cut steel version of the same logo

PNG to DXF

Trace PNG and JPG images into DXF shapes for laser cutting, CNC and CAD.

Open PNG to DXF
Laser-cut plywood panel standing next to a laptop showing the same pattern as vector lines

DXF converter

Open DXF drawings and save them as PDF or SVG, with layouts, line weights and hatches.

Open the DXF converter
Machined aluminium bracket next to a laptop showing the same part as a 3D CAD model

STEP viewer

Open STEP and IGES files from SolidWorks, Fusion 360 and Inventor. See every part and measure.

Open the STEP viewer
Laptop showing a 3D model of a lounge chair beside small printed and wooden 3D models on a desk

3D viewer

Open 18 kinds of 3D file online, from STEP and FBX to GLB and IFC, with parts and measuring.

Open the 3D viewer
Tablet showing a glossy 3D product model of a sneaker in a web viewer next to the real shoe

GLB viewer

Open GLB and glTF files with their materials and textures, size and triangle count.

Open the GLB viewer
Monitor showing a textured 3D model of a ceramic vase next to the real vase on the desk

OBJ viewer

Open OBJ files with their MTL materials and textures, and save as STL, GLB or STEP.

Open the OBJ viewer
Laptop showing a blue-grey 3D CAD model of a mechanical part next to a 3D printed copy of the part

SolidWorks viewer

Open SolidWorks part files without SolidWorks, then save them as STL, STEP or GLB.

Open the SolidWorks viewer
Desktop 3D printer with a printed grey building model on its build plate

STL viewer

View STL files for 3D printing with size, volume, weight and a watertight check.

Open the STL viewer
Laptop showing a wireframe house model, with a 3D printed and a wooden model of the same house

3D converter

Convert between STEP, OBJ, FBX, STL, glTF, PLY, IFC and more, in both directions.

Open the 3D converter
Machined aluminium part next to an identical 3D printed plastic copy

STEP to STL

Convert STEP and STP files from SolidWorks, Fusion 360 and Inventor to STL for 3D printing.

Open STEP to STL
Desktop 3D printer printing a multi-colour part, with a finished part and a spool of filament beside it

3MF to STL

Convert 3MF files from Bambu Studio and PrusaSlicer to STL, or STL to 3MF.

Open 3MF to STL
White 3D printed lithophane of a mountain landscape lit from behind by window light

Image to STL

Turn PNG and JPG images into STL or OBJ reliefs and lithophanes for 3D printing.

Open image to STL
3D printed parts and a small printed building model with a spool of filament

STL converter

Convert 3D files and images to STL for 3D printing, with a watertight check.

Open the STL converter
Laptop showing a textured 3D model of a lounge chair, with fabric and wood samples

OBJ converter

Convert STL, FBX, STEP, glTF and 3DS to OBJ with materials, or OBJ to other formats.

Open the OBJ converter
Monitor showing a grey 3D human figure in a T-pose with its bone skeleton

FBX converter

Convert FBX files from 3ds Max, Maya and Blender to OBJ, GLB or STL.

Open the FBX converter
1,247
Projects completed
13
Years in business
17
Countries delivered to
★★★★★ Rated 5.0 on Clutch · See our reviews

Architects, developers & interior designers.

Working for 215 companies since 2013.

125 of 220 clients came back.

More than half of our clients have hired us again.

From empty to finished

Need the after photo made?

Send the photos of the empty rooms or the site, and say what the after should show. We reply with one fixed price and a delivery date within 30 minutes.

Get a fixed quote in 30 minutes See virtual staging