Introduction

framecn provides beautifully crafted, production-ready video components for React. Built on Editframe and designed to work seamlessly with the shadcn CLI.

Philosophy

framecn follows the shadcn model — but for video. Components are yours to copy, own, and customize. No runtime lock-in, no black-box abstractions. Just composable Editframe scenes that drop into your stack.

Video in product work is often an afterthought — stitched together from stock clips or half-finished motion presets. framecn takes a different approach. Every component is a self-contained, time-based composition: animated in code, renderable to MP4, and built to match the precision of your UI design system.

The goal is simple: make video feel like the rest of your stack — composable, themeable, and easy to customize.

Why framecn?

Most video tooling forces you to choose between full creative control and developer ergonomics. framecn is built for teams that want both:

• Own Your Code: Copy components into your project and customize everything — timing, easing, colors, copy.
• Start Fast: Run one command and render your first video scene with production-ready defaults.
• Scale Safely: Compose primitives into full sequences, or drop to raw Editframe APIs when you need more control.

What's Included

framecn ships components across six categories:

• Primitives — Time-based atoms: cursors, confetti, spring animations, bounding boxes, and indicators.
• Compositions — Full scenes ready to render: deploy flows, dashboard populates, AI generation beats, hero reveals.
• Transitions — Scene-to-scene motion: wipes, zooms, kinetic masks, chromatic aberrations, and spatial pushes.
• Typography — Animated text: typewriters, marquees, glitch decodes, shimmer sweeps, and staggered reveals.
• UI Blocks — Animated product UI: charts, code diffs, drag-and-drop flows, terminal simulators, bento grids.
• Environment & Lighting — Atmospheric backgrounds: mesh gradients, dynamic grids, spotlight cards.

Features