Back to Remotion

Composition

packages/docs/docs/terminology/composition.mdx

4.0.4621.1 KB
Original Source

A composition is something you can render. It consists of:

<Step>1</Step> a React component

<Step>2</Step> the canvas width and height

<Step>3</Step> a "frames per second" (FPS) value

<Step>4</Step> a duration value

<Step>5</Step> an identifier <code>id</code>

It can be registered in the Remotion Studio by rendering a <Composition> component.
A composition with a duration of 1 frame is also called a <Still>.

In the Remotion Player, you don't use the <Composition> component, rather you pass the component and metadata directly to the <Player>.

Not to be confused with <Sequence>.

Composition ID

The string that you pass as the id prop to the <Composition> component.
You need the composition ID to reference what you would like to render, for example: npx remotion render src/index <composition-id>.

See