docs-demo
Add an interactive demo to the Remotion documentation. Use when creating a new <Demo> component for docs pages.
Install
With your agent
Install OMGSkills skill "remotion-dev/remotion:docs-demo" into this agent's normal skills directory: call the OMGSkills MCP get_install_plan tool for your agent and run the script it returns (it installs only the pinned commit and verifies SKILL.md), and stop if MCP or the pin is unavailable. Do not overwrite or change existing skills without asking me.
Manual command
git clone https://github.com/remotion-dev/remotion /tmp/remotion && ln -s /tmp/remotion/.agents/skills/docs-demo ~/.claude/skills/docs-demoFrom README
Adding an Interactive Demo to Docs Interactive demos render a Remotion composition inline in documentation pages using @remotion/player. They live in packages/docs/components/demos/. Effect demos are separate: use and register them in packages/docs/components/effects-demos/registry.ts with the real effect schema, not the generic options array. Steps Create a component in packages/docs/components/demos/ (e.g. MyDemo.tsx). It should be a standard React component using Remotion hooks like useCurrentFrame() and useVideoConfig(). Register the demo in packages/docs/components/demos/types.ts: Import the component Export a DemoType object with these fields: id: unique string used in comp: the React component compWidth / compHeight: canvas dimensions (e.g.