# snapcn

> snapcn is a shadcn-style registry of 24 production-ready video components for Remotion (React). Developers install components with `npx shadcn@latest add @snapcn/<component>`; the source and everything it depends on is copied into their project and they own the code. Typical use: building product demo videos, launch videos and social clips in React.

**The install namespace is `@snapcn`, one word.** It was `@snap-cn` before 2026-08-21 and that spelling no longer resolves — `npx shadcn@latest add @snap-cn/text-reveal` fails. If you learned the hyphenated form, use `@snapcn` instead. Component names themselves are unchanged.

Prerequisites: an existing Remotion project (`npx create-video@latest`) and the shadcn CLI. License: MIT. Site: https://snapcn.dev

Maintained by Sri Nath. Project account: https://x.com/snapcndev
Last updated: 2026-08-25 (newest component release)

Full docs as one file: https://snapcn.dev/llms-full.txt

## getting-started

- [Agent Skill](https://snapcn.dev/docs/getting-started/agent-skill): Install the snapcn agent skill with skills.sh so your AI generates better Remotion videos
- [Installation](https://snapcn.dev/docs/getting-started/installation): Add snapcn to an existing Remotion project
- [Introduction](https://snapcn.dev/docs/getting-started/introduction): What snapcn is and who it's for

## components

- [Components](https://snapcn.dev/docs/components): Every component in snapcn, grouped by category

## text

- [Text & Titles](https://snapcn.dev/docs/text): Kinetic headlines, reveals, swaps, highlights and lower thirds — the decorative title layer of a video.
- [Text Build](https://snapcn.dev/docs/text/text-build): Words enter one at a time while the already-placed words physically reflow to stay centered — on the x axis as a growing line or the y axis as a growing stack
- [Text Highlight](https://snapcn.dev/docs/text/text-highlight): A mark wipes a wordmark open, spins into its lockup, then swings wide and comes round past the lens while its ink floods the frame — plus five span-emphasis presets
- [Text Reveal](https://snapcn.dev/docs/text/text-reveal): A cinematic zoom-out title reveal — the lead word floats up close to the viewer, falls back to size, then the sentence pushes in word by word and slides into place
- [Text Swap](https://snapcn.dev/docs/text/text-swap): Replace one line of text with another — by default the old line rushes the camera and flies past you, and the new one is revealed behind it
- [Text Swell](https://snapcn.dev/docs/text/text-swell): The lead word rises into the middle and floats toward you — then the rest of the sentence pushes in from the right, bouncing its letters, and shoves the lead word aside before the whole line falls back
- [Type Morph](https://snapcn.dev/docs/text/type-morph): A headline that types itself under a glowing caret, sheds its lead, morphs letter by letter, and ends under a colour flood
- [Word Flip](https://snapcn.dev/docs/text/word-flip): A headline types itself out, then one word cycles on a 3D flip — sinking into an anticipation dip, throwing up and away about its baseline under motion blur, while the next word unfurls from below.

## captions

- [Captions](https://snapcn.dev/docs/captions): Burned-in, transcript-timed subtitles with word-pop and karaoke styles and safe-area presets for 16:9, 1:1 and 9:16.
- [Karaoke Captions](https://snapcn.dev/docs/captions/karaoke-captions): Full-line captions with a progressive fill sweep across the spoken words and accent-colored keyword emphasis
- [Word Captions](https://snapcn.dev/docs/captions/word-captions): TikTok-style word-by-word burned-in captions from a timed transcript

## logos

- [Logos](https://snapcn.dev/docs/logos): Logo stings and entrances for brand moments in launch videos.
- [Block Wordmark](https://snapcn.dev/docs/logos/block-wordmark): A wordmark that builds itself out of solid blocks — a deck shuffles, collapses, splits one block per letter, and each block flashes and cuts to its real letterform
- [Logo Assemble](https://snapcn.dev/docs/logos/logo-assemble): A scatter of cards collapses into a brand card that is born tilted and settles — revealing the logo and brand name
- [Logo Flicker](https://snapcn.dev/docs/logos/logo-flicker): Images flip across the screen very fast, the flicker decelerates and fades, and the logo and brand name resolve

## screens

- [Screens & Devices](https://snapcn.dev/docs/screens): Phone frames, terminals and AI-product simulations — the demo toolkit.
- [Laptop Frame](https://snapcn.dev/docs/screens/laptop-frame): MacBook-style laptop that opens, runs a notch notification, then dives into the screen until it fills the frame
- [Phone Frame](https://snapcn.dev/docs/screens/phone-frame): iPhone-style device frame with a dynamic island and a screen slot — flat, tilted, or a cinematic 3D showcase crane move
- [Terminal Simulator](https://snapcn.dev/docs/screens/terminal-simulator): Single-camera flythrough — one continuous camera whips from a headline to a package-manager command panel to a zoomed green terminal, all on one canvas

## social

- [Social Proof](https://snapcn.dev/docs/social): Follower counts, notifications and community milestones — the beat of a video that says other people are already here.
- [Follower Rush](https://snapcn.dev/docs/social/follower-rush): An X-style follower notification that piles up — avatars stack in and the count explodes, then the row bends into an undulating wave of faces

## scenes

- [Scenes](https://snapcn.dev/docs/scenes): Full scene compositions for launch and demo videos
- [Announce Title](https://snapcn.dev/docs/scenes/announce-title): A four-shot announcement title — the eyebrow rushes past the camera on a receding type plane, the name assembles on paper, and a macro pan cuts wide as the tagline builds itself last word first
- [Product Hero](https://snapcn.dev/docs/scenes/hero-launch): Cinematic product-launch hero — two cards slide into formation as the headline reveals above
- [Moodboard Reveal](https://snapcn.dev/docs/scenes/moodboard-reveal): A kinetic headline, a scattered photo gallery, a camera push from dark to light, landing on a hero image
- [Orbit Gallery](https://snapcn.dev/docs/scenes/orbit-gallery): An image-universe hero — a stream of photos flows along an Archimedean spiral vortex from the frame edges into the center, evenly arc-spaced, shrinking and rotating along the coil, with the title held in the clear middle
- [Status Cycle](https://snapcn.dev/docs/scenes/status-cycle): A status pill whose label rolls behind a hard clip while its width springs past the target and back, then the field crossfades to a column of chips stepping up from below

## tools

- [Showcase](https://snapcn.dev/docs/showcase): Videos built with snapcn, submitted by the community.
- [Video Editor](https://snapcn.dev/docs/video-editor): Compose a video from snapcn components — add clips, edit text and images, and export an MP4.

## project

- [Changelog](https://snapcn.dev/docs/changelog): Every component in snapcn, by the day it landed.
- [Roadmap](https://snapcn.dev/docs/roadmap): What snapcn is, what is being built next, and what is only an idea so far.

## docs

- [Documentation](https://snapcn.dev/docs): snapcn is a shadcn registry of Remotion components — install an animation into your own project and own the file.

## ai-input

- [AI Chat Input](https://snapcn.dev/docs/ai-input): Prompt bars, search fields and chat composers that type themselves — the shot where a product gets asked a question.
- [Answer Stream](https://snapcn.dev/docs/ai-input/answer-stream): The beat after send — a macro shot on the button that cuts hard to the answer building itself, while the camera pulls back to keep up with it
- [Prompt Zoom](https://snapcn.dev/docs/ai-input/prompt-zoom): A prompt field that types a sentence into itself and, partway through, cuts — hard, in a single frame — into the caret and keeps going
- [Search Typing](https://snapcn.dev/docs/ai-input/search-typing): A search field wider than the shot — two thirds in frame, then it comes forward, types across its left half, pages to its right half, and goes back