Remocn

Overview

Remocn is a library of ready-made Remotion animations, transitions, shaders and app-screen simulations designed for making product demo videos with an AI coding agent. The workflow is to open an agent such as Claude Code, Cursor or ChatGPT in an empty folder, paste one prompt that sets up a project, installs the remocn skill and opens a browser preview, then describe changes while the video updates.

The registry holds more than 430 components installed as source with the shadcn CLI, built on Remotion and its captions, transitions and fonts packages, with shader backgrounds from Paper Design. A companion desktop app, Remocn Studio, lets the agent build the video while the user tunes it.

Features

• Text animations: Per-character rises, word streams, typewriter, slot machine roll, matrix decode, RGB glitch and kinetic text.
• Transitions: Fade through, shared axis, slides, mask reveals and wipes.
• Shaders: Mesh gradients, liquid metal, god rays, caustics, metaballs, Voronoi and noise backgrounds with preset palettes.
• Motion graphics: Logo stings, camera and physics effects, graphic looks and filters.
• UI and layout: App-screen simulations and layout pieces for showing a product inside the video.
• Animated icons: Check, heart, bell, download, send, loader and other icon animations.
• Agent skill: A remocn skill that lets coding agents pick and assemble pieces.

Tech stack

• React, Remotion, @remotion/captions, @remotion/transitions, @remotion/google-fonts
• @paper-design/shaders-react, shadcn CLI registry

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @remocn/component-name