# Introducing
URL: https://remocn.dev/docs/logo-stings/introducing

An eyebrow settles then lifts as the wordmark lands with a sweep of light and a tagline.

- Install: `npx shadcn@latest add @remocn/introducing`
- Vibe: premium
- Natural length: 86f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/introducing
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { Introducing } from "@/components/remocn/introducing";

const IntroducingScene = () => (
  <Introducing
    eyebrow="Introducing"
    name="remocn"
    tagline="Launch-video scenes for Remotion. Copy, paste, render."
  />
);

export const RemotionRoot = () => (
  <Composition
    id="Introducing"
    component={IntroducingScene}
    durationInFrames={120}
    fps={30}
    width={1280}
    height={720}
  />
);
```

A large eyebrow settles in the centre and lifts to make room, then the name lands with a sweep of light and the tagline rises word by word. Pass `eyebrow`, `name` or `logo`, `tagline` and `accent`. Ships light and dark.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `eyebrow` | `string` | `"Introducing"` | Small line that settles then lifts before the name lands. |
| `name` | `string` | `"remocn"` | Product name; Remocn renders the real logo. |
| `logo` | `React.ReactNode` | — | Mark set before the name, sized to its cap height. |
| `tagline` | `string` | `"Launch-video scenes for Remotion. Copy, paste, render."` | One line under the lockup. |
| `accent` | `string` | `"#3B5BFD"` | Colour of the light passing through the name. |
| `background` | `string` | — | Stage fill colour; overrides the theme background. |
| `speed` | `number` | `1` | Playback multiplier for the whole timeline; 1 is normal speed. |
| `theme` | `"dark" \| "light"` | `"dark"` | Dark or light palette and ground. |

## Use when
- A product announcement that opens with Introducing and a one-line tagline.
- A launch video opener right before the first product demo.
- A rebrand or new-version reveal with a calm, premium tone.

## Don't use when
- The version number should be the hero — use `sequel-numeral`.
- You want a streak of light instead of a settling eyebrow — use `light-signature`.
- The rhythm should come from fast word cuts — use `blink-cut`.