Yes Run

A string of short questions is each answered with the same bold Yes tag on bright orange.

Installation

$ pnpm dlx shadcn@latest add @remocn/yes-run

Usage

tsx

// src/Root.tsx
import { Composition } from "remotion";
import { YesRun } from "@/components/remocn/yes-run";
 
const YesRunScene = () => (
  <YesRun questions={["Vertical?", "Captions?", "Your fonts?"]} answer="Yes." />
);
 
export const RemotionRoot = () => (
  <Composition
    id="YesRun"
    component={YesRunScene}
    durationInFrames={150}
    fps={30}
    width={1280}
    height={720}
  />
);

Each question in questions is answered by the answer tag landing next to it, quickening as they go. Pass questions and answer to answer your own FAQ. It ships in light and dark through the theme prop.

Props6

Prop	Type	Default
questions	string[]DEFAULT_QUESTIONS Short questions answered in turn.
answer	string"Yes." Answer shown on the tag.
accent	string— Accent color override; falls back to the theme accent.
background	string— Background color override; falls back to the theme background.
speed	number1 Playback speed multiplier for the whole timeline.
theme	"dark" \| "light""dark" Ships light and dark; picks the palette.

questionsstring[]
Short questions answered in turn.
DefaultDEFAULT_QUESTIONS
answerstring
Answer shown on the tag.
Default"Yes."
accentstring
Accent color override; falls back to the theme accent.
backgroundstring
Background color override; falls back to the theme background.
speednumber
Playback speed multiplier for the whole timeline.
Default1
theme"dark" | "light"
Ships light and dark; picks the palette.
Default"dark"