1---
2name: trimming
3description: Trimming patterns for Remotion - cut the beginning or end of animations
4metadata:
5  tags: sequence, trim, clip, cut, offset
6---
7 
8Use `<Sequence>` with a negative `from` value to trim the start of an animation.
9 
10## Trim the Beginning
11 
12A negative `from` value shifts time backwards, making the animation start partway through:
13 
14```tsx
15import { Sequence, useVideoConfig } from "remotion";
16 
17const fps = useVideoConfig();
18 
19<Sequence from={-0.5 * fps}>
20  <MyAnimation />
21</Sequence>;
22```
23 
24The animation appears 15 frames into its progress - the first 15 frames are trimmed off.
25Inside `<MyAnimation>`, `useCurrentFrame()` starts at 15 instead of 0.
26 
27## Trim the End
28 
29Use `durationInFrames` to unmount content after a specified duration:
30 
31```tsx
32<Sequence durationInFrames={1.5 * fps}>
33  <MyAnimation />
34</Sequence>
35```
36 
37The animation plays for 45 frames, then the component unmounts.
38 
39## Trim and Delay
40 
41Nest sequences to both trim the beginning and delay when it appears:
42 
43```tsx
44<Sequence from={30}>
45  <Sequence from={-15}>
46    <MyAnimation />
47  </Sequence>
48</Sequence>
49```
50 
51The inner sequence trims 15 frames from the start, and the outer sequence delays the result by 30 frames.
52