Drag the line.
Watch it transform.
Every comparison below is the real block, running live. Grab a handle and pull, on the divider or anywhere on the image. Use arrow keys when a handle is focused.
Slide across, or top to bottom
Set the divider to run vertically for a left-to-right wipe, or horizontally to reveal from the top. The handle, keyboard arrows and labels follow the orientation.
Labels and hover, when you want them
Add Before and After labels for context, or switch on hover mode so the slider follows the cursor with no clicking. Touch devices keep the drag.
Several comparisons, one block
Add more comparisons and they line up in a row, sharing one design and aspect ratio. On phones they stack so each stays readable.
One click sets the whole look
Presets change the line, handle and corners together. Below: the default, a bold dark handle and a soft minimal one. Every value stays adjustable afterwards.