Fine Print Up

"No account and no watermark. Ever." in a big serif with tiny fine print at the bottom

Installation

$ pnpm dlx shadcn@latest add @remocn/fine-print-up

Usage

tsx

// src/Root.tsx
import { Composition } from "remotion";
import { FinePrintUp } from "@/components/remocn/fine-print-up";
 
const FinePrintUpScene = () => <FinePrintUp lines={["Every component you install is a file you own.", "No account and no watermark. Ever."]} closing="That’s all the fine print." />;
 
export const RemotionRoot = () => (
  <Composition
    id="FinePrintUp"
    component={FinePrintUpScene}
    durationInFrames={300}
    fps={30}
    width={1280}
    height={720}
  />
);

Each line is set big in turn with a star mark, then shrinks and travels down to the fine print at the bottom of the frame, and finally the closing line lands big. Pass lines (the claims) and closing; it spaces the lines to fit the composition length.

Props6

Prop	Type	Default
lines	string[]DEFAULT_LINES Claims set big first, then moved to the fine print.
closing	string"That’s all the fine print." Final big line shown after the fine print is built.
accent	string— Color of the star marks; defaults to the theme accent.
background	string— Stage fill color; pass "transparent" to overlay your own footage.
speed	number1 Playback multiplier for the whole timeline.
theme	"dark" \| "light""dark" Color scheme; ships dark and light.

linesstring[]
Claims set big first, then moved to the fine print.
DefaultDEFAULT_LINES
closingstring
Final big line shown after the fine print is built.
Default"That’s all the fine print."
accentstring
Color of the star marks; defaults to the theme accent.
backgroundstring
Stage fill color; pass "transparent" to overlay your own footage.
speednumber
Playback multiplier for the whole timeline.
Default1
theme"dark" | "light"
Color scheme; ships dark and light.
Default"dark"