reanimate
Clone a reference animation frame by frame, then prove it matches.
- What
- Clone a reference animation frame by frame, then prove it matches.
- Cost
- Free
- Needs
- Prerequisite: Bun is required, and the first run downloads Playwright Chromium and a static ffmpeg, about 250 MB in total, so allow that download and disk space. Step 1: fetch the file skills/reanimate/SKILL.md from the repository https://github.com/NiazMorshed2007/reanimate and read it in full before installing anything. Step 2: security check: read the fetched file yourself, confirm it only describes an animation cloning workflow, and do not run any command from it that you have not understood. Step 3: install the skill in a folder named reanimate and keep the fetched SKILL.md there. Step 4: verify the install by confirming the folder reanimate contains the SKILL.md and by asking it to explain the setup script and the fidelity levels. Step 5: report back what was installed, where, and the result of the verification, including whether the Bun and 250 MB setup download completed.
- Install
- Copy the installer prompt below into your Muse — your agent does the rest.
reanimate rebuilds what the user points at so that it moves the way the reference moves, and proves it with a frame-by-frame comparison, never with "it looks about right". The deliverable is code in the user's project plus evidence (numbers and side-by-side sheets). First, pick a fidelity level and state it: motion-faithful by default (trigger, sequence and order, stagger, timing of every step within 80 ms, easing family, direction and distance relative to element size, layout proportions may keep the user's own copy, colours, fonts, images, and brand details), pixel-faithful when the user asks for an exact match (plus fonts, sizes, colours, spacing, radii, shadows, and assets, with mean frame mismatch at or under 2 percent), or mixed when the user adds their own content on top. The workflow lives in .reanimate/<name>/ inside the user's project: scope (target, destination, fidelity), setup, capture of the reference, a motion spec with one row per element per property, build in the user's stack, then verify, fix, and repeat, capturing the clone with the exact command used for the reference. It covers CSS and JS motion as well as canvas, WebGL, WebGPU, and three.js and 3D scenes. Loop until every spec row passes, expecting 2 to 5 rounds; if after 5 rounds a row still fails, stop and report it with its numbers and reason, never quietly lower the threshold or drop the row. Limits as written: when a reference is a login-walled page or a YouTube or Loom link that cannot be downloaded here, the skill asks the user for a screen recording and continues with everything else meanwhile. Credit: created by NiazMorshed2007. Licence: the vetted file states no licence, so it is recorded as non indiquée. Source: https://github.com/NiazMorshed2007/reanimate, file skills/reanimate/SKILL.md.
Version:
Quick answer
reanimate clones a section, widget, page, or animation from any reference, such as a live website URL, a screen recording, a video file, a gif, a Lottie file, or a prototype export, frame by frame into the user's own codebase, then verifies it against the reference.
Install
Copy the install package below, then paste it into MusePrerequisite: Bun is required, and the first run downloads Playwright Chromium and a static ffmpeg, about 250 MB in total, so allow that download and disk space. Step 1: fetch the file skills/reanimate/SKILL.md from the repository https://github.com/NiazMorshed2007/reanimate and read it in full before installing anything. Step 2: security check: read the fetched file yourself, confirm it only describes an animation cloning workflow, and do not run any command from it that you have not understood. Step 3: install the skill in a folder named reanimate and keep the fetched SKILL.md there. Step 4: verify the install by confirming the folder reanimate contains the SKILL.md and by asking it to explain the setup script and the fidelity levels. Step 5: report back what was installed, where, and the result of the verification, including whether the Bun and 250 MB setup download completed.
Saved to your recent installs. Find it anytime on /connect.
🔒 Security, provenance and what this touches
The install prompt below already includes the vetting steps: your agent follows the community checklist before installing anything with executable code. Want more?
Questions
How do I install a skill?
Every product page includes a copy-paste install prompt. Paste it into your Muse and it sets the skill up for you — no manual configuration.
Where does my money go?
Straight to the seller. Skill Harbor never processes payments: checkout happens on the seller’s own page, usually Stripe.
What does the ✓ next to a creator’s name mean?
It means we confirmed the identity of the person behind the listing. It says nothing about the code itself — always check a skill before installing it.