Before and after

Two photos of the same view with a divider you drag: a driveway before and after cleaning, a kitchen before and after a renovation. Without JavaScript the photos sit side by side with their labels; with assets/js/compare.js they overlap and a slider moves the divider. Drag or tap the photo, or focus it and use the arrow keys.

Default (divider in the middle)

Still water at dawn Calm
A wave cresting in a storm Storm
The labels are the figure's own text, so "Before" and "After" can be anything. Photos: Fluid sample library

Square crop, divider starting at 25%

A stream through quiet woodland Stream
Rapids in full flow Rapids
Photos: Fluid sample library

Markup, options and notes: _docs/reference/components.md, "Before / After compare".