Not Yet

Lines of what it can't do build word by word, each ending in an accent Yet., and stack upward.

Installation
$ pnpm dlx shadcn@latest add @remocn/not-yet

Usage

tsx
// src/Root.tsx
import { Composition } from "remotion";
import { NotYet } from "@/components/remocn/not-yet";
 
const NotYetScene = () => (
  <NotYet
    lines={["It can’t write your script.", "It can’t pick your music."]}
    word="Yet."
  />
);
 
export const RemotionRoot = () => (
  <Composition
    id="NotYet"
    component={NotYetScene}
    durationInFrames={170}
    fps={30}
    width={1280}
    height={720}
  />
);

Each line builds word by word and finishes with the accent word (Yet. by default). The next line then pushes in beneath it while earlier lines shrink and dim above a thin rule, so the newest line is always the largest. Pass lines and optionally a different word. Timing compresses to fit the composition; 173 frames is the uncompressed length of the three defaults. It ships light and dark.

Props6

PropTypeDefault
lines
string[]DEFAULT_LINES

Lines of text; each one is followed by the accent word.

word
string"Yet."

Accent word appended to every line.

accent
string—

Accent color; overrides the theme accent.

background
string—

Background fill; pass "transparent" to drop it.

speed
number1

Playback speed multiplier for the whole timeline.

theme
"dark" | "light""dark"

Light or dark palette.

  • linesstring[]

    Lines of text; each one is followed by the accent word.

    DefaultDEFAULT_LINES

  • wordstring

    Accent word appended to every line.

    Default"Yet."

  • accentstring

    Accent color; overrides the theme accent.

  • backgroundstring

    Background fill; pass "transparent" to drop it.

  • speednumber

    Playback speed multiplier for the whole timeline.

    Default1

  • theme"dark" | "light"

    Light or dark palette.

    Default"dark"