Maintainer of this skill?
by Remocn
Production-ready animations, transitions, backgrounds, and scenes for Remotion
# Add to your Claude Code skills
git clone https://github.com/Remocn/remocnGuides for using ai agents skills like remocn.
See how remocn compares with popular alternatives.
remocn is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by Remocn. Production-ready animations, transitions, backgrounds, and scenes for Remotion. It has 1,697 GitHub stars.
remocn's catalog security scan is still queued. You can run an instant dependency and prompt-injection check now with the "Scan for vulnerabilities" button above.
Clone the repository with "git clone https://github.com/Remocn/remocn" and add it to your Claude Code skills directory (see the Installation section above).
remocn is primarily written in TypeScript. It is open-source under Remocn on GitHub, so you can review or fork the full source.
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh remocn against similar tools.
No comments yet. Be the first to share your thoughts!
Available after the catalog security scan passes.
⚠️ Third-Party Software Notice
This skill is third-party open-source software developed and hosted independently on GitHub. SkillsLLM is an informational directory and does not control or maintain the underlying repository.
Any security checks, ratings, or warnings displayed by SkillsLLM are automated and limited in scope. They do not constitute a security certification or guarantee that the software is safe, error-free, or free from malicious code, vulnerabilities, compromised dependencies, or prompt-injection risks.
Review the source code, permissions, dependencies, and configuration before installing or running any third-party skill. Use is at your own risk. To the maximum extent permitted by applicable law, SkillsLLM is not liable for losses arising from third-party software.
The deep catalog scan for this skill is still queued. Run an instant dependency check now instead.
Remocn is a copy-paste component library for building videos in Remotion. Instead of writing every fade, wipe, and kinetic title from scratch, you npx shadcn add a polished primitive into your project and own the code. Built for solo builders and small teams who need a product demo video shipped today, not next week.
Rather direct the video than write it? Remocn Studio is a free, open-source macOS app where your own coding agent (Claude Code, Codex, GitHub Copilot or Grok) builds the video from Remocn components while you watch the live preview.
Production-ready Remotion code: every component uses useCurrentFrame(), interpolate(), and spring() correctly. No Math.random() traps that break rendering. Own your code: components are copied into your project, not installed as a dependency. Tweak them however you like. Live previews: each component page mounts a real @remotion/player you can scrub frame-by-frame
Remotion is a prerequisite — set up a Remotion project first if you don't have one (npx create-video@latest). Then add any component from the registry:
npx shadcn@latest add @remocn/blur-reveal
You need two things: an AI coding agent and an empty folder.
1. Get an agent. We recommend Claude Code, also works with ChatGPT, Opencode and others. 2. Open the agent in an empty folder and paste:
Set up a new Remotion video project in this folder, then install the remocn agent skill: npx skills add Remocn/remocn --yes. When you're done, start the preview studio so I can watch the video while we work
When a browser tab opens with an empty video player, you're ready. Pick a guide and make it yours.
The remocn plugin bundles the skill with a /remocn:video workflow: brief → storyboard → install → compose → visual check → open in Remocn Studio.
/plugin install remocn --marketplace Remocn/remocn
In Codex: codex plugin marketplace add Remocn/remocn, then codex plugin add remocn@remocn.
Remocn runs a hosted MCP server for making videos with Remotion at https://remocn.dev/mcp. Add the URL to Claude Code, Cursor, Codex or any MCP client. There's no API key and no account.
| URL | https://remocn.dev/mcp |
| Transport | Streamable HTTP |
| Auth | None |
| Access | Read-only; it does not render video |
| License | MIT, free |
| Clients | Claude Code, Claude Desktop and claude.ai, Cursor, VS Code, Codex, any Streamable HTTP client |
Tools:
search_components: find Remocn components by query, vibe or length in framesget_component: one component's docs as Markdown: props, usage example, install commandplan_video: turn a brief into a beat-by-beat storyboard with component pickspreview_component: a live preview link, played inline in clients that support MCP AppsClaude Code:
claude mcp add --transport http remocn https://remocn.dev/mcp
Codex:
codex mcp add remocn --url https://remocn.dev/mcp
Cursor (.cursor/mcp.json):
{
"mcpServers": {
"remocn": { "url": "https://remocn.dev/mcp" }
}
}
Your agent installs what it picks with npx shadcn@latest add @remocn/<name>, and you render with Remotion as usual. The plugin above already includes the server. Setup for every client: MCP server docs.
Remocn is free and MIT-licensed. These sponsors keep the registry growing and the renders fast.
Become a sponsor to get your logo on the landing page, in the docs sidebar and here.