remotion-dev/remotion · error · TypeError

You have passed a volume below 0 to your <${component} /> co

Error message

You have passed a volume below 0 to your <${component} /> component. Volume must be between 0 and 1

What it means

validateMediaProps throws a TypeError when volume is a number but below 0. Remotion requires volume in the range [0, 1] (with values above 1 allowed to amplify); negative volume is meaningless and rejected. The message notes the valid range.

Source

Thrown at packages/core/src/validate-media-props.ts:22

	props: {
		volume: VolumeProp | undefined;
		playbackRate: number | undefined;
		preservePitch?: boolean | undefined;
	},
	component: 'Html5Video' | 'Html5Audio' | 'Audio' | 'Video',
) => {
	if (
		typeof props.volume !== 'number' &&
		typeof props.volume !== 'function' &&
		typeof props.volume !== 'undefined'
	) {
		throw new TypeError(
			`You have passed a volume of type ${typeof props.volume} to your <${component} /> component. Volume must be a number or a function with the signature '(frame: number) => number' undefined.`,
		);
	}

	if (typeof props.volume === 'number' && props.volume < 0) {
		throw new TypeError(
			`You have passed a volume below 0 to your <${component} /> component. Volume must be between 0 and 1`,
		);
	}

	if (
		typeof props.playbackRate !== 'number' &&
		typeof props.playbackRate !== 'undefined'
	) {
		throw new TypeError(
			`You have passed a playbackRate of type ${typeof props.playbackRate} to your <${component} /> component. Playback rate must a real number or undefined.`,
		);
	}

	if (
		typeof props.playbackRate === 'number' &&
		(isNaN(props.playbackRate) ||
			!Number.isFinite(props.playbackRate) ||
			props.playbackRate <= 0)

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Clamp to 0: `volume={Math.max(0, v)}`.
  2. Fix the interpolation output range to stay within [0, 1] (or higher for amplification).
  3. Validate the source data for negative values.
  4. Use the function form to clamp per-frame: `volume={(f) => Math.max(0, fn(f))}`.

Example fix

// before
<Audio src={url} volume={interpolate(frame, [0, 30], [-0.5, 1])} />

// after
<Audio src={url} volume={interpolate(frame, [0, 30], [0, 1])} />
Defensive patterns

Strategy: validation

Validate before calling

const v = typeof volume === 'number' ? Math.max(0, volume) : volume;
// then pass v

Type guard

const isNonNegativeNumber = (v: unknown): v is number => typeof v === 'number' && v >= 0;

Prevention

When it happens

Trigger: Passing a negative number for volume; arithmetic that produces a negative (e.g. subtraction overshooting); interpolation ranges that dip below 0; data entry errors.

Common situations: Interpolate with an output range starting negative; volume computed from a curve that goes below zero; sign errors in math; user input of negative values.

Related errors


AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/55bfc0deee184f69. Report an issue: GitHub.