remotion Skill (google-labs-code/stitch-skills): What It Does and How to Install It

Makes Claude turn the screens of a Google Stitch project into a walkthrough video built with Remotion.

Installs: 41.7K; on skills.sh
Stars: 8.7K; on GitHub
Files: 6; besides SKILL.md
Updated: Aug 2026; last repo commit

remotion, from Google Labs' stitch-skills repo, makes Claude pull screens from a Stitch project and build a Remotion video with transitions, zoom and text overlays. It downloads each screenshot, writes a screens.json manifest and React components, previews in Remotion Studio and renders an MP4. It needs the Stitch MCP server set up first, plus Node.js and either the Remotion MCP server or the Remotion CLI. If no Remotion project exists, it creates one and installs npm packages.

Good for

Designers who build app screens in Google Stitch and want a demo video
Developers who make walkthrough videos with Remotion
Product teams who need a quick app preview for a launch
Claude Code users who already have Stitch MCP set up

Install remotion

Claude Code

Copy this prompt.

Install the remotion skill in Claude Code. Run this command:

npx skills add google-labs-code/stitch-skills --skill remotion --global

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js, Stitch MCP server, Remotion MCP server or Remotion CLI.

The skill needs both the Stitch MCP server and a way to run Remotion. SKILL.md lists the Remotion MCP server or the Remotion CLI as the two options.

From the project README. Source.

What's in the skill

When it loads

Generate walkthrough videos from Stitch projects using Remotion with smooth transitions, zooming, and text overlays

Sections in SKILL.md

Overview
Prerequisites
Retrieval and Networking
Step 1: Discover Available MCP Servers
Step 2: Retrieve Stitch Project Information
Step 3: Set Up Remotion Project
Video Composition Strategy
Architecture
Transition Effects
Text Overlays
Execution Steps
Step 1: Gather Screen Assets
Step 2: Generate Remotion Components
Step 3: Preview and Refine
Step 4: Render Video
Advanced Features

Key facts

Author: google-labs-code
Repository: google-labs-code/stitch-skills
License: Apache-2.0
Installs on skills.sh: 41,739 (Nov 2, 2026)
GitHub stars: 8,653 (Nov 2, 2026)
skills.sh audits: Gen Agent Trust Hub pass, Socket pass, Snyk pass (Nov 2, 2026)
Last repo commit: Aug 17, 2026
Files: 7 files including SKILL.md: README, 2 examples, 2 resource templates and 1 shell script (download-stitch-asset.sh)
Needs: The Stitch MCP server, Node.js and the Remotion MCP server or Remotion CLI
Status: The skill README says this is not an officially supported Google product
Not the same as: Remotion's own skills (remotion-dev/skills), which SKILL.md points to separately

What it includes

Runs list_tools to find the Stitch and Remotion MCP servers and their prefixes
Runs code · Discover MCP servers
Calls list_projects, list_screens and get_screen for each screen's image, size and title
Network · Retrieve Stitch screens
Saves screenshots to assets/screens/ using curl, web_fetch or the bundled script
scripts/download-stitch-asset.sh takes a URL and an output path, creates the folder, runs curl -L -f and removes the file if the download fails.
Runs code · Download assets
Creates a video/ project with npm create video@latest and installs two @remotion packages
Runs code · Set up Remotion
Writes ScreenSlide.tsx, WalkthroughComposition.tsx and a remotion.config.ts
Uses the bundled screen-slide template and composition checklist as a starting point.
Write · Generate components
Starts npm run dev so you can adjust timing, transitions and text
Runs code · Preview in Remotion Studio
Renders an MP4 with npx remotion render, or through the Remotion MCP
Runs code · Render video
Optional hotspots, voiceover with audio sync and text pulled from each screen's HTML
Advanced features
Three layouts: simple slide show, feature highlight and user flow
Common patterns

From the official docs

Permissions

Medium risk

It runs npm and shell commands, writes files into your project and downloads screenshots from links Stitch returns, with Bash and file writing among its allowed tools. Run it on a branch and read each command before you approve it.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

It installs npm packages and runs shell commands
SKILL.md has Claude run npm create video@latest and npm install @remotion/transitions @remotion/animated-emoji, and the frontmatter allows unrestricted Bash. Read each command before you approve it. github.com
It downloads files from links Stitch returns
The helper script runs curl -L -f to a path you give it, creating the folder and deleting the file if the download fails. Only point it at Stitch download links. github.com
It writes a video project into your repo
It creates a video/ folder, assets/screens/, screens.json and output.mp4. Run it in a clean branch or a separate folder. github.com
Your design screens go to your AI provider
Claude downloads screenshots and optionally the HTML of each screen. Do not use it on confidential unreleased designs unless your provider terms allow that. github.com

Security advisories

No published security advisories as of Nov 2, 2026.

Technical details

Turning on read-only	No read-only setting is documented.
Talks to	The npm registry for Remotion packages. Stitch download URLs for screenshots and HTML. Your AI provider receives the screens and project data Claude reads
Sign-in and keys	Stitch MCP credentials come from the Stitch MCP setup guide that the repo README links; SKILL.md stores nothing itself.
Scopes	Claude runs npm create video, npm install, npm run dev and npx remotion render download-stitch-asset.sh creates the output folder and runs curl with -L and -f to save a file Claude writes a video/ project, assets/screens/, screens.json and the rendered MP4 Allowed tools in the frontmatter: stitch and remotion MCP tools, Bash, Read, Write, web_fetch

Questions

How do I install the remotion skill?

Use the install box above, then set up the Stitch MCP server using the guide the repo README links. The README also documents a Codex plugin route and a Claude Code and Cursor route through npx plugins that install whole Stitch suites.

Is this the official Remotion skill?

No. It lives in Google Labs' stitch-skills repo and bridges Stitch and Remotion. SKILL.md points to Remotion's own skills (remotion-dev/skills) as a separate thing to install for animation and composition techniques.

Do I need Stitch?

Yes. SKILL.md lists access to the Stitch MCP server and a Stitch project with designed screens as required.

Does it work in the Claude app?

The README documents no Claude app install. The skill runs npm and Remotion on your machine and needs MCP servers, so use Claude Code or another local agent.

Does it need an API key?

SKILL.md names no key. Stitch MCP credentials come from the Stitch MCP setup guide, and the repo README says to follow it for environment variables and credentials.

Is the remotion skill safe?

It runs npm installs and shell commands and writes a video project into your repo, so run it on a branch and read each command. It also downloads your Stitch screenshots, which then pass through your AI provider.

Information

updated Nov 2, 2026

Repository: google-labs-code/stitch-skills
Folder: plugins/stitch-build/skills/remotion

google-labs-code/stitch-skills skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 6

remotion skill README · github.com
stitch-skills README · github.com
skills CLI commands · github.com
remotion SKILL.md · github.com
remotion on skills.sh · skills.sh
download-stitch-asset.sh · github.com