# Embossed Mark
URL: https://remocn.dev/docs/graphic-looks/embossed-mark

The R mark and wordmark are debossed into a brushed grey surface as a raking light sweeps across

- Install: `npx shadcn@latest add @remocn/embossed-mark`
- Vibe: premium
- Natural length: 112f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/embossed-mark
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { EmbossedMark } from "@/components/remocn/embossed-mark";

const EmbossedMarkScene = () => <EmbossedMark name="emocn" />;

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

A mark is pressed into a grey surface; a raking light sweeps around it, deepening the shadows. The camera eases out, a foil fill appears in the mark and the `name` letters fade in after it. Pass a custom `logo` node (square slot, black fill) to replace the default R and set `name` to the letters that follow. Ships dark and light via `theme`.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `logo` | `React.ReactNode` | — | Custom mark to deboss instead of the R (square slot, black fill). |
| `name` | `string` | `"emocn"` | Letters printed after the mark; with the default R this reads Remocn. |
| `accent` | `string` | `"#3B5BFD"` | Color stop in the foil fill. |
| `theme` | `"dark" \| "light"` | `"dark"` | Color scheme. Ships dark and light. |
| `speed` | `number` | `1` | Playback speed multiplier for the whole timeline. |

## Use when
- A premium logo sign-off where the brand looks pressed into paper or metal.
- A tactile end card with a moving light that reveals relief and a foil fill.
- Introducing a wordmark with an unhurried, material feel instead of a flashy animation.

## Don't use when
- You want a fast, simple logo entrance — use `logo-enter`.
- The logo should be written like a signature line — use `light-signature`.
- You want the logo shown on a reflective floor — use `studio-reflection`.