OpenCode
OpenCode TUI composer scene for Remotion.
SceneScenes
opencode30fps · 960×540
Install
$ npx remotion-ui@latest add opencodeAnimated OpenCode TUI with wordmark, accent input bar, and agent status row.
Agent notes
Install first, then import the copied source component locally. AI guide →
Import
@/remotion/scenes/opencode- Use when: full-frame scenes, overlays, cards, and reusable video sections.
- Customize: placeholder, query, agentName, modelName, plus copied source for timing, layout, colors, and typography.
- Rule: do not import this component from the
remotion-uinpm package; it is copied into your project.
Usage
Example
import { Opencode } from "@/remotion/scenes/opencode";
<Opencode query='"What is the tech stack of this project?"' />API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| placeholder | string | - | Muted prefix before the typed query. |
| query | string | - | Query typed after the placeholder. |
| agentName | string | "Build" | Active agent label. |
| modelName | string | - | Model name in the status row. |
| provider | string | - | Model provider label. |
| accentColor | string | "#2B7FFF" | Left accent bar and agent color. |
| theme | "light" | "dark" | "dark" | Light or dark TUI palette. |