Open Animate — Creative Suite for Agents
Create professional motion graphics and generate visual assets. Describe what you want. Get an MP4.
Prerequisites
This skill builds on Remotion skills for core Remotion API patterns:
npx skills add remotion-dev/skills
Workflow
1. Initialize project
npx oanim init my-video
cd my-video
2. Compose using @oanim/core
import { fadeUp, popIn, Background, SafeArea, palettes } from '@oanim/core';
See references/animation-cookbook.md for the full presets reference.
3. Preview
npx remotion studio
4. Render to MP4
npx oanim render
5. Generate and use media assets (optional)
MCP tools (preferred — works in Cowork and any MCP-enabled environment):
| Tool |
Use |
gen_image |
Generate images from text prompts |
edit_image |
Edit existing images with prompts |
remove_bg |
Remove background from an image |
upscale |
Upscale image 2x |
gen_video |
Generate video from text (async, polls until done) |
gen_audio |
Generate audio/music from text (async, polls until done) |
run_model |
Run any fal.ai model with custom input |
CLI (fallback — requires outbound HTTP):
npx oanim assets gen-image --prompt "dark gradient abstract" --out public/bg.png
npx oanim assets run --model fal-ai/kling-video/v2.5-turbo/pro/text-to-video \
--input '{"prompt":"cinematic abstract motion","duration":"5"}' --out public/clip.mp4
npx oanim assets run --model beatoven/music-generation \
--input '{"prompt":"ambient electronic, no vocals","duration_in_seconds":30}' --out public/music.mp3
Then use in your composition:
import { Img, OffthreadVideo, Audio, staticFile } from 'remotion';
<Img src={staticFile('bg.png')} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
<OffthreadVideo src={staticFile('clip.mp4')} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
<Audio src={staticFile('music.mp3')} volume={0.25} />
Capabilities
| Capability |
MCP Tool |
CLI Command |
| Project scaffolding |
— |
oanim init |
| Animation presets (fadeUp, popIn, springs) |
— |
@oanim/core |
| Components (Terminal, Card, Badge, GlowOrb) |
— |
@oanim/core |
| Scene transitions (fadeBlur, clipCircle, wipe) |
— |
@oanim/core |
| Typography (AnimatedCharacters, TypewriterText, CountUp) |
— |
@oanim/core |
| Design tokens (5 palettes, fonts, spacing) |
— |
@oanim/core |
| Rendering to video |
— |
oanim render |
| Cloud rendering |
— |
oanim render --cloud |
| AI image generation |
gen_image |
oanim assets gen-image |
| AI image editing |
edit_image |
oanim assets edit-image |
| Background removal |
remove_bg |
oanim assets remove-bg |
| Image upscaling |
upscale |
oanim assets upscale |
| AI video generation |
gen_video |
oanim assets run (video models) |
| AI audio generation |
gen_audio |
oanim assets run (audio models) |
| Any fal.ai model |
run_model |
oanim assets run |
| Media compositing |
— |
<Img>, <OffthreadVideo>, <Audio> via staticFile() |
References
references/workflow.md — Step-by-step agent workflowreferences/scene-config.md — animate.json schema referencereferences/composition-patterns.md — Multi-scene composition architecturereferences/animation-cookbook.md — Full @oanim/core presets referencereferences/asset-generation.md — AI asset generation guidereferences/media-guide.md — Using generated media in compositions (Img, Video, Audio)
Templates
templates/launch-video.md — 4-scene product launch (5s)templates/explainer.md — Step-based explainer video (20s)templates/logo-reveal.md — Logo animation with glow (5s)templates/meme-caption.md — Vertical social clip (6s)templates/investor-update.md — Metrics dashboard (15s)
1---2name: open-animate3description: Open Animate — the creative suite for AI agents. Create professional motion graphics, generate images, and render MP4 videos. Use when the user wants to make videos, animations, motion graphics, social clips, product launches, explainers, or any visual content. Supports asset generation (images, backgrounds, upscaling) and video composition with animation presets, transitions, and components.4license: Apache-2.05---67# Open Animate — Creative Suite for Agents89Create professional motion graphics and generate visual assets. Describe what you want. Get an MP4.1011## Prerequisites1213This skill builds on **Remotion skills** for core Remotion API patterns:14```bash15npx skills add remotion-dev/skills16```1718## Workflow1920### 1. Initialize project21```bash22npx oanim init my-video23cd my-video24```2526### 2. Compose using `@oanim/core`27```tsx28import { fadeUp, popIn, Background, SafeArea, palettes } from '@oanim/core';29```3031See `references/animation-cookbook.md` for the full presets reference.3233### 3. Preview34```bash35npx remotion studio36```3738### 4. Render to MP439```bash40npx oanim render41```4243### 5. Generate and use media assets (optional)4445**MCP tools** (preferred — works in Cowork and any MCP-enabled environment):4647| Tool | Use |48|------|-----|49| `gen_image` | Generate images from text prompts |50| `edit_image` | Edit existing images with prompts |51| `remove_bg` | Remove background from an image |52| `upscale` | Upscale image 2x |53| `gen_video` | Generate video from text (async, polls until done) |54| `gen_audio` | Generate audio/music from text (async, polls until done) |55| `run_model` | Run any fal.ai model with custom input |5657**CLI** (fallback — requires outbound HTTP):58```bash59npx oanim assets gen-image --prompt "dark gradient abstract" --out public/bg.png60npx oanim assets run --model fal-ai/kling-video/v2.5-turbo/pro/text-to-video \61 --input '{"prompt":"cinematic abstract motion","duration":"5"}' --out public/clip.mp462npx oanim assets run --model beatoven/music-generation \63 --input '{"prompt":"ambient electronic, no vocals","duration_in_seconds":30}' --out public/music.mp364```6566Then use in your composition:67```tsx68import { Img, OffthreadVideo, Audio, staticFile } from 'remotion';6970<Img src={staticFile('bg.png')} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />71<OffthreadVideo src={staticFile('clip.mp4')} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />72<Audio src={staticFile('music.mp3')} volume={0.25} />73```7475## Capabilities7677| Capability | MCP Tool | CLI Command |78|------------|----------|-------------|79| Project scaffolding | — | `oanim init` |80| Animation presets (fadeUp, popIn, springs) | — | `@oanim/core` |81| Components (Terminal, Card, Badge, GlowOrb) | — | `@oanim/core` |82| Scene transitions (fadeBlur, clipCircle, wipe) | — | `@oanim/core` |83| Typography (AnimatedCharacters, TypewriterText, CountUp) | — | `@oanim/core` |84| Design tokens (5 palettes, fonts, spacing) | — | `@oanim/core` |85| Rendering to video | — | `oanim render` |86| Cloud rendering | — | `oanim render --cloud` |87| AI image generation | `gen_image` | `oanim assets gen-image` |88| AI image editing | `edit_image` | `oanim assets edit-image` |89| Background removal | `remove_bg` | `oanim assets remove-bg` |90| Image upscaling | `upscale` | `oanim assets upscale` |91| AI video generation | `gen_video` | `oanim assets run` (video models) |92| AI audio generation | `gen_audio` | `oanim assets run` (audio models) |93| Any fal.ai model | `run_model` | `oanim assets run` |94| Media compositing | — | `<Img>`, `<OffthreadVideo>`, `<Audio>` via `staticFile()` |9596## References9798- `references/workflow.md` — Step-by-step agent workflow99- `references/scene-config.md` — animate.json schema reference100- `references/composition-patterns.md` — Multi-scene composition architecture101- `references/animation-cookbook.md` — Full `@oanim/core` presets reference102- `references/asset-generation.md` — AI asset generation guide103- `references/media-guide.md` — Using generated media in compositions (Img, Video, Audio)104105## Templates106107- `templates/launch-video.md` — 4-scene product launch (5s)108- `templates/explainer.md` — Step-based explainer video (20s)109- `templates/logo-reveal.md` — Logo animation with glow (5s)110- `templates/meme-caption.md` — Vertical social clip (6s)111- `templates/investor-update.md` — Metrics dashboard (15s)
jacobcwright