Mografy skill
A skill for Claude Code and Codex: the agent writes animation scenes, a browser player shows them, export to MP4 and Lottie.
- 55 ★ on the repository
- Last commit
Extended access
Why this level
- Installation runs `pnpm install` with a Chromium download, and the agent runs build and export scripts on your computer.
Install
- Works in
Manual install
git clone https://github.com/zz41354899/mografy.gitThe first command of Get started. Then `cd mografy`, `pnpm install` and `mografy dev`.
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Installation runs `pnpm install` with a Chromium download, and the agent runs build and export scripts on your computer.
This is third-party code. Review the repository files before installing.
What it does
Mografy is a local tool for Canvas animation. The shared `mografy` skill helps the agent plan a storyboard, adapt working examples, write scenes, review frames and export the result. The browser player in `mografy dev` offers playback, scrubbing, subtitles, colours, effects and audio controls. The agent edits scene files while Mografy compiles and trial-renders them in Chromium, then updates the player at the same position. The finished clip exports to MP4, Lottie and SVGA. `mografy add <template...> projects/<name>` starts a project from 43 free templates for product videos, and a `style.md` file fixes design and motion decisions.
Who it is for. Developers and marketers who need animated clips and intros and are ready to describe a scene to an agent instead of editing by hand.
Good fit when
- A 15-second product clip is needed and it is easier to describe than to assemble in an editor.
- Animation must ship as Lottie or SVGA for an app, not only as video.
- You want to start from a ready 9:16 template for social media.
- A scene must be watched in the player and edited as you talk to the agent.
Not a fit when
- A real interface recording or footage is needed: the tool draws on Canvas.
- One picture or GIF is enough and scenes with a player only complicate work.
- The project cannot be installed from source: installation is a clone and `pnpm install`.
Example request
Use mografy to make a 12-second intro for the app: logo, three points and a closing screen, exported to MP4.Limitations
Node.js 22.12 or newer is needed. Installation is from source: clone the repository and run `pnpm install`, which builds Mografy, downloads Chromium for checks and export and puts `mografy` on `PATH`. `mografy update` updates it from the install folder. Part of the documentation is in Chinese. The optional music generator is set up separately. 3D layers on Three.js were added in October 2026.
How to disable. Delete the repository clone and the shared `mografy` skill from the agent's skills directory. The downloaded Chromium sits in the tool cache and is removed by hand.
FAQ
Which output formats are there?
MP4, Lottie and SVGA. Export runs in Chromium, which installs with the tool.
How do I start a new project?
Run `mografy add <template> projects/<name>`. There are 43 templates: 22 vertical 9:16 and 21 horizontal 16:9.
Which agents are supported?
Claude Code and Codex. The `mografy` skill is shared by both.
How do I update?
Check with `mografy update --check`, then run `mografy update` in the install folder. Updating stops on local changes.
Where are projects stored?
In the `projects/` folder. Set `MOGRAFY_HOME` before starting the player to use another location.
Discussion
No questions or reviews yet.
Related
SkillsA Claude Code skill for short animated videos drawn in code: seven styles, story and storyboard sign-off, voice-over and an MP4 render
A skill that makes promo videos from code: direction, in-browser animation with motion blur, its own score and a 60 fps MP4
A Claude Code skill for code-made video: it splits a clip into scenes and picks an engine for each, from Paper.js to Manim.
A skill for Claude Code and Codex that turns one sentence into a product launch film, scores the music and edits a frame on click
A skill for promo films and kinetic type: idea and storyboard before the build, MP4 rendered through Chrome and ffmpeg, checked by six gates
A Claude Code skill that builds motion graphics in code: 21 ready looks, five questions, three approval stills and an MP4 render.
README in short
Describes player capabilities, the agent workflow, quick start, updates and 43 templates, plus architecture and development.