AI-First
Videos are plain React + TypeScript — the languages LLMs understand best. AI agents can generate, modify, and iterate on compositions without any special tooling.
Create videos programmatically with React and TypeScript — designed for AI agents, LLM pipelines, and automated video production. Fully open source.
Rendiv treats every video as a pure function of the current frame number. No GUI, no binary project files — just React components that any developer or AI agent can read, write, and iterate on.
import { useFrame, Fill, interpolate, spring } from '@rendiv/core';
export const MyVideo = () => {
const frame = useFrame();
const opacity = interpolate(frame, [0, 30], [0, 1]);
return (
<Fill style={{ background: '#0f0f0f', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
<h1 style={{ color: 'white', fontSize: 80, opacity }}>
Hello, Rendiv!
</h1>
</Fill>
);
};| Package | Description |
|---|---|
@rendiv/core | Core runtime — hooks, components, animation utilities |
@rendiv/cli | CLI for studio, render, still, and compositions commands |
@rendiv/player | Embeddable React player component |
@rendiv/studio | Studio dev server — preview, timeline, render queue |
@rendiv/renderer | Node.js server-side rendering API |
@rendiv/bundler | Vite-based bundler for compositions |
@rendiv/transitions | Transition primitives (fade, slide, wipe, flip, clockWipe) |
@rendiv/shapes | SVG shape generators |
@rendiv/paths | SVG path manipulation and animation |
@rendiv/noise | Simplex noise for organic animations |
@rendiv/motion-blur | Trail and camera motion blur effects |
@rendiv/fonts | Custom font loading with holdRender |
@rendiv/google-fonts | Google Fonts integration |
npx create-rendiv my-video
cd my-video
npx rendiv studio src/index.tsxApache License 2.0 — free for personal projects, commercial products, open-source libraries, and SaaS applications. See the LICENSE for the full text.