Download for macOS
Skill

add-effect

@remotion-dev Updated 2026-10-22

Add a new effect to @remotion/effects, including implementation, package exports, docs, demos, preview images, Remotion skill updates, formatting, and builds.

javascriptreactvideo

Install

git clone https://github.com/remotion-dev/remotion /tmp/remotion && ln -s /tmp/remotion/.agents/skills/add-effect ~/.claude/skills/add-effect

From README

Add a new @remotion/effects effect Use this skill when adding a new effect to @remotion/effects. Pick the effect shape Prefer the WebGL2 backend for new effects. Use 2D only when WebGL cannot express the effect. Use a single file at packages/effects/src/ .ts for simple effects. Use a folder at packages/effects/src/ / plus a top-level re-export file when the effect needs multiple shaders, runtime helpers, or multiple files. Follow naming already used by the package: File/subpath: kebab-case (chromatic-aberration) Function: camelCase (chromaticAberration) Type: PascalCase params (ChromaticAberrationParams) Effect type string: remotion/ Implement the effect In the effect file: Import SequenceSchema and Internals from remotion. Use const {createEffect, createWebGL2ContextError} = Internals;. Define defaults as const values. Define a schema with satisfies SequenceSchema; these fields appear in Studio visual editing. Export the params type. Resolve defaults in a resolve() helper.