Filler Cut

A transcript has its filler words cut, leaving a clean line, 'Ship your launch video today.'

Installation

$ pnpm dlx shadcn@latest add @remocn/filler-cut

Usage

tsx

// src/Root.tsx
import { Composition } from "remotion";
import { FillerCut } from "@/components/remocn/filler-cut";
 
const FillerCutScene = () => <FillerCut transcript="So, um, ship your, like, launch video, uh, today. You know?" keep="Ship your launch video today." highlight="today." />;
 
export const RemotionRoot = () => (
  <Composition
    id="FillerCut"
    component={FillerCutScene}
    durationInFrames={150}
    fps={30}
    width={1280}
    height={720}
  />
);

A spoken-style transcript appears with filler words marked, the filler is cut out one phrase at a time with a timecode, and the remaining words reflow and set into a clean headline with the last word highlighted. Pass transcript (the messy text), keep (the clean line) and highlight.

Props7

Prop	Type	Default
transcript	string"So, um, ship your, like, launch video, uh, today. You know?" The raw spoken text, including the filler words.
keep	string"Ship your launch video today." The clean line; words not in it are cut.
highlight	string"today." Phrase in the clean line set in the accent color.
showTime	booleantrue Show the running timecode while words are cut.
accent	string"#3B5BFD" End color of the gradient fill on the clean headline.
speed	number1 Playback multiplier for the whole timeline.
theme	"dark" \| "light""dark" Color scheme; ships dark and light.

transcriptstring
The raw spoken text, including the filler words.
Default"So, um, ship your, like, launch video, uh, today. You know?"
keepstring
The clean line; words not in it are cut.
Default"Ship your launch video today."
highlightstring
Phrase in the clean line set in the accent color.
Default"today."
showTimeboolean
Show the running timecode while words are cut.
Defaulttrue
accentstring
End color of the gradient fill on the clean headline.
Default"#3B5BFD"
speednumber
Playback multiplier for the whole timeline.
Default1
theme"dark" | "light"
Color scheme; ships dark and light.
Default"dark"