# Introduction
URL: https://remocn.dev/docs/getting-started/introduction

What Remocn is: a shadcn-style component registry for Remotion plus an agent skill. Copy-paste video components, MIT, code lives in your repo.

**Copy-paste components**

Text animations, transitions, backgrounds, UI blocks and icons, added to a [Remotion](https://www.remotion.dev) project with the shadcn CLI.
  **Plus an agent skill**

Teaches AI coding agents how to compose a video from those components.
  **MIT, code in your repo**

Everything is MIT. Files are copied into your repo, where you own and edit them.

If you searched for “remotion shadcn” or “shadcn remotion”, this is the thing you were looking for.

## If you know shadcn/ui

The workflow is the one you already use. Remocn is a namespaced registry, so components are addressed by name and copied in as files you own and edit.

Timing is expressed in frames. Every component page tells you how many frames its motion takes, so you can budget a Sequence.

## If you know Remotion

A fresh Remotion project gives you a blank canvas and the right APIs. Remocn gives you the parts every product video needs, which you would otherwise rebuild each time.

Each one already uses the Remotion APIs correctly and avoids the traps that break deterministic rendering.

## Two tiers of components

Remocn ships two tiers of components. Both install the same way, as files in your repo.

Familiar shadcn primitives rebuilt so their states are [scripted on the timeline](/docs/ui) instead of driven by the user.

## What Remocn is not

- **Not After Effects or a video editor.** There is no timeline UI to drag things around in. You write or prompt code, and Remotion Studio previews the result.
- **Not a hosted service.** Nothing runs on Remocn servers. No account, no runtime, no usage limits. Rendering happens on your machine or wherever you run Remotion.
- **Not a fork of Remotion.** Remotion is a prerequisite, and Remocn is a set of components written against its public API. Remotion keeps [its own license](https://www.remotion.dev/docs/license); Remocn's own code is MIT.
- **Not only AI chat components.** The [AI section](/docs/ai) recreates chat composers and CLI screens because product demos need them often, but it is one category among text, transitions, backgrounds, layout, UI blocks and templates.

Remocn is an independent project. It is not affiliated with shadcn or with Remotion; it builds on the shadcn CLI and the Remotion library.

## Quick start

**Start from a Remotion project**

You need one. If you do not have it yet, create it:
  **Initialize shadcn and add a component**

Run init only if the project has no `components.json` yet.
  **Install the agent skill**

Optional. Do it if you work through an AI agent.
  **Go further with the plugin in Claude Code or Codex**

The [plugin](/docs/getting-started/plugin) carries the skill plus a workflow that plans, builds and checks a whole video from a one-line brief.

The Installation page covers the full flow, including the one-shot command that installs every component and the Add to Studio button for a running Remotion Studio.

## Remocn vs raw Remotion

| | Raw Remotion | Remotion + Remocn |
|---|---|---|
| Starting point | Empty composition | Composition plus a catalog of ready components |
| Animation code | Written per project | Copied in, then edited like any file you own |
| Timing | Decided per element | Each component states its natural length in frames |
| AI agents | Generic Remotion knowledge | Skill with catalog access, timing rules and scene recipes |
| Dependency | Remotion | Remotion, same as before. Remocn adds no runtime |

Nothing here replaces Remotion. If you already have a component library of your own, Remocn is a set of files to borrow from; if you are starting from a blank project, it is the fastest way to a first scene.

## FAQ

**Do I need to know how to code?**
Not necessarily, if you work through an AI coding agent. The [guides](/docs/guides) walk through building a video with prompts. Without an agent, you need to be comfortable with React and TypeScript.

**Do I need After Effects or a video editor?**
No. Everything happens in your editor and a browser preview.

**Is it free?**
Remocn is MIT licensed. Components copy onto your machine and stay yours.

**Does it work with any AI agent?**
The skill installs through [skills.sh](https://skills.sh) into agents that load skills, Claude Code among them. The components themselves are plain Remotion code and work with any agent or no agent at all.

**Is this the official shadcn registry for Remotion?**
No. It is a community registry that uses the shadcn CLI and registry format. shadcn and Remotion are separate projects with their own maintainers.

## What's next

- [Installation](/docs/getting-started/installation): add Remocn to an existing Remotion project
- [Agent Skill](/docs/getting-started/agent-skill): teach your AI agent to compose videos with Remocn
- [Components](/docs/components): every component, grouped by category
- [Homepage](/): see the kind of video Remocn is built for