packages/docs/docs/audio/trimming.mdx
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem';
The <Html5Audio /> tag supports the trimBefore and trimAfter props.
With it, you can trim off parts of the audio.
import {AbsoluteFill, Html5Audio, staticFile, useVideoConfig} from 'remotion';
export const MyComposition = () => {
const {fps} = useVideoConfig();
return (
<AbsoluteFill>
<Html5Audio src={staticFile('audio.mp3')} trimBefore={2 * fps} trimAfter={4 * fps} />
</AbsoluteFill>
);
};
This will result the audio to play the range from 00:02:00 to 00:04:00, meaning the audio will play for 2 seconds.
The audio will still play immediately at the beginning - to see how to shift the audio to appear later in the composition, see the next article.
:::note Legacy props
You can also use the deprecated startFrom and endAt props, but the new trimBefore and trimAfter props are preferred.
:::