piruicy
The collection

Hold to delete

after Emil Kowalski

A destructive button that confirms by being held: a red copy wipes across, slowly, and snaps back if you let go.

npx shadcn@latest add https://piruicy.com/r/hold-to-delete.json

Details

  • While held, a red copy of the button is wiped in with clip-path, 2s linear, so the fill reads as a deliberate meter.
  • Let go early and it snaps back in 200ms ease-out: the slow direction only exists to give time to confirm.
  • The press gives 0.97 over 160ms; no text selection or iOS long-press menu can hijack the hold.
  • Added to the pure-CSS original: it fires when the wipe completes, holds from Space or Enter, and announces the result.

© 2026 Dhaval Khandhadia. Use it in anything you build; don’t resell it. MIT with the Commons Clause.