Tool · Browser · 2025

Image Slider

Drop two images, drag the line between them. Zoom each side on its own, or lock them together and pan both at once. Nothing gets uploaded. The whole thing is one HTML file you can run offline.

Stack Vanilla JS

Size 1 file

Uploads Zero

Open App

Scroll to try it

Core mechanic

Drag to Compare

One clip-path on the top layer does the split. No canvas compositing, no DOM hacks. The handle has a wide invisible grab zone so it never feels fiddly, even on a phone screen.

clip-pathCSS

PointerEventsAPI

sub-pxsmooth

Zoom system

Independent Zoom

Each panel has its own zoom and position. You can sit one side at actual pixels and the other at fit-to-window, pinch around, and they never interfere with each other.

2×matrices

pinchgesture

1:1pxactual size

Sync mode

Sync Lock

Toggle sync and both sides move together. Pan left on one, both pan left. Works even when the two images have different resolutions, it figures out the scale difference automatically.

sharedtransform

autonormalize

anyresolution

Privacy

Zero Upload

Your images stay on your machine, full stop. There's no server, no fetch call, nothing sent anywhere. Save the page locally and it works without internet.

FileReaderAPI

0requests

offlinecapable

01 / 04

0 file The whole app. One .html file, no build step, no install.

0 uploads Nothing leaves your machine. Not a single pixel.

0 modes Drag, zoom, sync, or lock both sides together.

"
I wanted something I could just open and use without logging in or waiting for an upload. So I built it. One file, no account, works offline.
"

Design Intent

Built With

HTML5

Vanilla JS

CSS clip-path

Pointer Events API

FileReader API

Three.js

Zero deps