Zero deps · Canvas particles

Turn removals into dust

snapVanish(element, options?) returns a Promise that settles when the effect finishes. Dust colors come from getComputedStyle on the node and its descendants (no html2canvas or raster snapshots). A good fit for delete actions and dismissible cards.

Get started View on npm
TypeScript ESM + CJS ~1.5 kB gzip
/demo

Try the snap

Remove this card

One click runs the disintegration, then the node is removed from the DOM.

Example record

ID #snap-demo — this block dissolves into canvas particles tinted from this element’s computed CSS (background, text, border, and visible child paints).

/install

Install snap-vanish

npm install snap-vanish
yarn add snap-vanish
pnpm add snap-vanish
/api

API reference

snapVanish(element, options?)

Returns a Promise<void>.

Colors. There is no public sampleColors (or similar) helper. The package reads computed styles inside snapVanish and builds a palette from the target’s backgroundColor, color, borderColor, plus non-transparent paints on descendants.

OptionTypeDefaultDescription
duration number 1500 Animation length in ms
particles number 30 Particle count
removeElement boolean true Remove node on completion (otherwise hide)
onComplete () => void Sync callback after finish
seed number Optional PRNG seed for tests