Stamp

Plain captions where the words that matter slam down as a rubber stamp the moment they are spoken

Installation
$ pnpm dlx shadcn@latest add @remocn/caption-stamp

Usage

CaptionStamp takes a timed transcript and renders only the text block, so place it inside your own AbsoluteFill. Words read as a plain caption line until a keyword is spoken. Then the word slams down in stampColor inside a thin stamp frame, dropping from almost twice its size in under a tenth of a second, settling at its own slight angle and leaving a rough, speckled ink print. Without keywords, the longest word on each page is stamped, so the style works on a raw transcript. See Positioning for safe placements and Get a transcript for producing captions.json.

tsx
import { AbsoluteFill } from "remotion";
import { CaptionStamp } from "@/components/remocn/caption-stamp";
import captions from "./captions.json";
 
export const MyScene = () => (
  <AbsoluteFill
    style={{
      justifyContent: "flex-end",
      alignItems: "center",
      paddingBottom: 108,
      paddingInline: 192,
    }}
  >
    <CaptionStamp
      captions={captions}
      keywords={["thing", "lose", "three", "captions", "sound"]}
    />
  </AbsoluteFill>
);

Keywords match whole words, ignoring case and punctuation. The stamp frame sits over the word without taking up extra room, so the line never shifts when it lands.

Props11

PropTypeDefault
captions
Caption[]—

The timed transcript, in the `Caption` shape from `@remotion/captions`. Times are relative to the start of the surrounding `Sequence`.

keywords
string[]—

Words that get stamped. Matched per word, ignoring case and punctuation. When omitted, the longest word on each page is stamped.

stampColor
string"#ef4444"

Ink colour of the stamped word and its frame.

texture
booleantrue

Roughens the stamp edges and knocks small speckles out of the ink, like a real rubber stamp.

combineTokensWithinMilliseconds
number1200

How much speech one page may span before the next word starts a new page. Pages also break at the end of a sentence and on any pause of at least `holdMs` (300 ms minimum).

holdMs
number600

How long a page stays after its last word when the next page is not already due. It fades out at the end of the hold instead of hanging through the pause.

fontSize
number64

Font size in pixels.

fontWeight
number800

Font weight. The font itself is inherited.

color
string"#ffffff"

Colour of the words that are not stamped.

shadow
booleantrue

A tight text shadow that keeps the plain words legible over bright footage.

className
string—

Classes for the text block — width, font family, `uppercase`.

  • captionsCaption[]

    The timed transcript, in the `Caption` shape from `@remotion/captions`. Times are relative to the start of the surrounding `Sequence`.

    Default—

  • keywordsstring[]

    Words that get stamped. Matched per word, ignoring case and punctuation. When omitted, the longest word on each page is stamped.

    Default—

  • stampColorstring

    Ink colour of the stamped word and its frame.

    Default"#ef4444"

  • textureboolean

    Roughens the stamp edges and knocks small speckles out of the ink, like a real rubber stamp.

    Defaulttrue

  • combineTokensWithinMillisecondsnumber

    How much speech one page may span before the next word starts a new page. Pages also break at the end of a sentence and on any pause of at least `holdMs` (300 ms minimum).

    Default1200

  • holdMsnumber

    How long a page stays after its last word when the next page is not already due. It fades out at the end of the hold instead of hanging through the pause.

    Default600

  • fontSizenumber

    Font size in pixels.

    Default64

  • fontWeightnumber

    Font weight. The font itself is inherited.

    Default800

  • colorstring

    Colour of the words that are not stamped.

    Default"#ffffff"

  • shadowboolean

    A tight text shadow that keeps the plain words legible over bright footage.

    Defaulttrue

  • classNamestring

    Classes for the text block — width, font family, `uppercase`.

    Default—