This template is still in development. You may register your interest to get notified once it is available.

A <Timeline> component that synchronizes with the Remotion Player.

Intended for people who want to accelerate the process of building a web video editing interface with Remotion.

The timeline shows several tracks underneath each other. The length and position of the timeline indicates the timespan at which the content appears. Within a timeline layer, a preview can be rendered. In the example project, you can add video, image and text elements to the timeline. You can drag and drop to move them across time and move them to a different track.

Shipped in a Vite.js example project from which you can copy the source code. The timeline is built with TailwindCSS and React. No other dependencies are used.

See a deployment of the project at timeline.remotion.dev.

Stack:
TailwindCSSRemotionRemotion Player
Stack:
TailwindCSS
Remotion
Remotion Player
Last updated February 15, 2025
GitHub Repository
NPM Package
Copy and pasteable
Company license perk
Discuss this item:
#timeline