RemotionUI
Scenes

Hook Card

Short-form opener scene for creator clips.

SceneblocksAdvanced

Install
npx remotion-ui@latest add hook-card

Open reels, shorts, and launch clips with a large animated hook.

Live preview

AI usage

Install first, then import the copied source component locally.

AI guide

Install

npx remotion-ui@latest add hook-card

Import after install

@/remotion/scenes/hook-card
  • Use when: full-frame scenes, overlays, cards, and reusable video sections.
  • Customize: headline, kicker, subtitle, accentColor, plus copied source for timing, layout, colors, and typography.
  • Rule: do not import this component from the remotion-ui npm package; it is copied into your project.

Usage

import { HookCard } from "@/remotion/scenes/hook-card";

<HookCard
  kicker="Creator media"
  headline="Make the first second count"
  subtitle="A punchy opener for reels and shorts."
/>

API Reference

PropTypeDescription
headline*stringLarge hook text.
kickerstringSmall label above the headline.
subtitlestringOptional supporting line.
accentColorstringAccent sweep, label, and glow color.
backgroundColorstringScene background color.

Related