skills.rest
remotion-dev
remotion-devOFFICIAL
Explore all skills by this author →
Website𝕏@remotionGitHub

scaffold-element

Scaffold a new Remotion Element for development in the docs Remotion Studio.

57.9k|4.4k|Updated Jun 23, 2020
Search Tags:#contribution#Remotion#Animation#reAct#Scaffold#Element#docs studio
One-click install
npx skills add https://github.com/remotion-dev/remotion --skill scaffold-element
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: scaffold-element
Source: https://github.com/remotion-dev/remotion/tree/main/.agents/skills/scaffold-element
Command: npx skills add https://github.com/remotion-dev/remotion --skill scaffold-element

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Creating a new Remotion Element from scratch requires following a specific contribution workflow and project structure, which can be error-prone when done manually. This Skill guides the scaffolding process by referencing the official contribution guide and setting up the local development preview.

Core Features & Use Cases

  • Guided Scaffolding: Reads the official Element contribution guide and follows its development section to create a new Element.
  • Local Preview Setup: Launches the Docs Studio in headless mode so the new Element can be previewed in the browser.
  • Use Case: A contributor wants to add a new animated Element to the Remotion Elements library. Use this Skill to scaffold the Element files, then preview it locally in Docs Studio before submitting a pull request.

Quick Start

Scaffold a new Remotion Element and open it in the docs Remotion Studio for preview.

Frequently Asked Questions about scaffold-element

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a new Remotion Element for the docs library?▼

Follow the Element contribution guide in packages/docs/elements/contributing.mdx. Scaffold the Element files according to its Develop the Element section, then preview it locally using the docs Remotion Studio.

How to preview a Remotion Element locally during development?▼

Run the docs Remotion Studio from the packages/docs directory using bunx remotion studio --no-open. Read the printed URL and open it in your browser to view the Element.

Does the scaffold-element skill work outside the remotion-dev/remotion repository?▼

The skill references internal paths like packages/docs/elements/contributing.mdx and packages/docs, so it is designed to run inside the remotion-dev/remotion monorepo.

Why does the docs Remotion Studio need the --no-open flag?▼

The --no-open flag prevents the studio from automatically launching a browser window. This allows the agent to capture the URL from the command output and open it in the user's available browser.

When should I not use the scaffold-element skill?▼

Do not use this skill for modifying existing Elements, building standalone Remotion compositions, or contributing to non-Element packages. It is scoped specifically to creating new Elements for the docs library.

Related Skills

Explore More Software Engineering Skills→
levanminhduclevanminhduc

turborepo

Configure Turborepo task pipelines and caching for JavaScript/TypeScript monorepos.

Community
Advanced
remotion-devremotion-dev
4.2k

remotion-markup

Provide best practices for Remotion React markup performance and maintainability.

Official
Intermediate
SS2608-devSS2608-dev

rls-check

Verify Row Level Security policies are enabled on Supabase tables.

Community
Intermediate
module-federationmodule-federation
2.6k

mf-module-info

Fetch Module Federation metadata and analyze exposed, remote, and shared dependencies.

Official
Intermediate