Skip to content
Index730 resources
remocn

remocn

282 Remotion components for product-demo video, installed by the shadcn CLI

Tier S · Best in classAnimation LibraryRegistryComponent Libraryremocn.dev

(Visit remocn.dev ↗)(Docs)(Repository)(Registry)
Preview image from remocn.dev

remocn is a shadcn registry of 282 production-ready Remotion pieces for building product demo and launch videos in React code instead of a timeline editor. It is organised into eleven groups — Typography, Transitions, Shaders, Effects, Filters, Layout, Compositions, UI, UI Blocks, Social, and AI — covering text reveals (blur-out-up, kinetic-warp, slot-machine-roll), scene transitions (whip-pan, gooey-morph, dither-dissolve), GLSL shader backdrops, simulated app screens with a fake cursor, branded surfaces for Claude Code, ChatGPT, v0 and OpenCode, and ~110 animated icons. Every component is written against useCurrentFrame, interpolate and spring, and is copied into your repo rather than installed. MIT.

Install
npx shadcn@latest add @remocn/blur-reveal

For an agent

Start at /llms-components.txt, not the homepage — it is a single table of all 282 components with a `Use for` / `Avoid for` signal, a frame length at 30fps, a vibe tag, and registry dependencies, which is exactly the routing information you need before installing anything, and every docs URL also serves raw Markdown by appending .md. Budget scenes from the `Length` column (`state-driven` items have no duration of their own, `sustained` ones last as long as the scene wraps) and keep one vibe tag across a video rather than mixing. It only works inside an existing Remotion project, and shader components pull @paper-design/shaders-react, so check the dependency column before adding one to a light bundle.

Why it is here. The best-instrumented registry for agents I have seen: llms.txt, llms-full.txt, a routed component index with anti-recommendations, and Markdown for every docs page — plus it makes code-authored launch videos genuinely reachable without an editor.

Install command, framework, licence and component list.

Facts

License
MIT
Pricing
Free, Open source
Framework
React
Styling
Inline styles, Shader / GLSL
Distribution
shadcn registry, CLI installer, Copy-paste snippet, GitHub repository
Platform
Web
Content type
Code, Video
Agent readiness
Machine-readable registry item, CLI installable, llms.txt, Structured documentation, Agent skill or rules pack, Copy-paste ready code, Readable open source
Accessibility
Not applicable
Maturity
Actively maintained
GitHub stars
1,230

Components it ships

282 total
Text EffectTypewriter TextMarqueeTransitionPage TransitionAnimationGradient BackgroundParticle BackgroundShimmerConfettiCount UpCustom CursorTerminalCode BlockSpinnerButtonAccordionDialogAlert DialogSheetDrawerCheckboxRadio ButtonSwitchText InputSelectDropdown MenuTabsToastCommand PaletteTooltipProgress BarSkeletonSliderComboboxPopoverContext MenuToggle GroupProgress StepperResizableMessageTyping IndicatorConversationIconBar ChartLine ChartOnboarding FlowCheckoutSignup Form

Helps you build

5
HomepageFeature AnnouncementOnboarding Web AppCheckoutSign Up

Notable for

  • 282 components across 11 categories
  • llms-components.txt routing table with use / avoid signals
  • GLSL shader backdrops via paper-design
  • branded AI surfaces (Claude Code, ChatGPT, v0, OpenCode)
  • ~110 animated icons

Provenance

Verified 2026-08-15. HTTP 200. https://www.remocn.dev/, https://www.remocn.dev/r/registry.json (parsed, all 282 items enumerated), https://www.remocn.dev/llms.txt, https://www.remocn.dev/llms-components.txt (category list and routing table), https://www.remocn.dev/r/typewriter.json (source inspected for styling), https://github.com/Remocn/remocn, GitHub API repos/Remocn/remocn

Also in Motion & Interaction

6
remocn.devTier S