unvibed.
Menu
Free UI audit
All motion techniques

Comparison wipe.

Slide a divider across two registered impressions of the same print to inspect the ink change at any point.

Cobalt covers 50%

Resting states
First ink only → Second ink only
Reduced motion
Select either labeled proof for an immediate, full-frame comparison.

Implementation excerpt

style={{ clipPath: `inset(0 ${100 - percent}% 0 0)` }}

Where Unvibed uses it

The divider reveals the original and rebuilt ledger at matching viewport sizes. The Tallybook comparison

Related design directions