Got Em

A suspense line resolves into an exploded 'GOT 'EM' over a gradient sunburst

Installation

$ pnpm dlx shadcn@latest add @remocn/got-em

Usage

tsx

// src/Root.tsx
import { Composition } from "remotion";
import { GotEm } from "@/components/remocn/got-em";
 
const GotEmScene = () => (
  <GotEm pending="Entry submitted" title="GOT ’EM" subline="You got Acme 2.0." />
);
 
export const RemotionRoot = () => (
  <Composition
    id="GotEm"
    component={GotEmScene}
    durationInFrames={140}
    fps={30}
    width={1280}
    height={720}
  />
);

A suspense line with an animated ellipsis holds, then the payoff explodes in huge over a gradient sunburst with a subline beneath. Pass pending, title, subline and your own logo; it ships light and dark.

Props7

Prop	Type	Default
pending	string"Entry submitted" The suspense line; an animated ellipsis follows it.
title	string"GOT ’EM" The payoff, exploded huge. Use a real apostrophe (’).
subline	string"You got remocn 2.0." Subline under the payoff. "remocn" inside it renders the real logo.
logo	React.ReactNode— Replaces the logo inside the subline.
theme	"dark" \| "light""dark" Colour scheme; ships light and dark.
speed	number1 Playback multiplier; above 1 plays faster.
accent	string— Kept for the shared draft API; the rays take the "halo" gradient.

pendingstring
The suspense line; an animated ellipsis follows it.
Default"Entry submitted"
titlestring
The payoff, exploded huge. Use a real apostrophe (’).
Default"GOT ’EM"
sublinestring
Subline under the payoff. "remocn" inside it renders the real logo.
Default"You got remocn 2.0."
logoReact.ReactNode
Replaces the logo inside the subline.
theme"dark" | "light"
Colour scheme; ships light and dark.
Default"dark"
speednumber
Playback multiplier; above 1 plays faster.
Default1
accentstring
Kept for the shared draft API; the rays take the "halo" gradient.