add-sfx

Prerequisites

generate.ts

@remotion/sfx

• WAV format
• CC0 (Creative Commons 0) licensed
• Normalized to peak at -3dB

Steps

1. Add to

remotion.media

repo (must be done first)

remotion-dev/remotion.media

1. Add the WAV file to the root of the repo
2. Add an entry to the

   soundEffects

   array in

   generate.ts

   :
   ts

   {
     fileName: "my-sound.wav",
     attribution:
       "Description by Author -- https://source-url -- License: Creative Commons 0",
   },

3. Run

   bun generate.ts

   to copy it to

   files/

   and regenerate

   variants.json

4. Deploy

2. Add the export to

packages/sfx/src/index.ts

uiSwitch

switch

export const mySound = 'https://remotion.media/my-sound.wav';

3. Create a doc page at

packages/docs/docs/sfx/<name>.mdx

whip.mdx

• Frontmatter with

  image

  ,

  title

  (camelCase export name),

  crumb: '@remotion/sfx'

• <AvailableFrom>

  tag with the next release version

• <PlayButton>

  import and usage
• Description
• Example code using

  @remotion/media

  's

  <Audio>

  component
• Value section with the URL in a fenced code block
• Duration section (fetch the file and use

  afinfo

  on macOS to get duration/format)
• Attribution section with source link and license
• See also section linking to related sound effects

4. Register in sidebar and table of contents

• packages/docs/sidebars.ts

  — add

  'sfx/<name>'

  to the

  @remotion/sfx

  category items

• packages/docs/docs/sfx/table-of-contents.tsx

  — add a

  <TOCItem>

  with a

  <PlayButton size={32}>

5. Update the skills rule file

packages/skills/skills/remotion/rules/sfx.md

6. Build

cd packages/sfx && bun run make

Naming conventions

my-sound.wav

mySound

switch.wav

uiSwitch

page-turn.wav

pageTurn

Version

packages/core/src/version.ts

<AvailableFrom>