remotion-dev/remotion · error · TypeError

Cannot interpolate a multi-angle rotate value with an axis r

Error message

Cannot interpolate a multi-angle rotate value with an axis rotation

What it means

Thrown by interpolateString when the outputRange mixes an axis-rotation form (e.g. "x 45deg", "1 0 0 45deg") with a plain multi-angle rotate value that has more than one angle (e.g. "45deg 30deg"). Axis rotations carry a fixed 4-dimensional vector (x,y,z,angle); promoting a 2-or-3-angle rotate to that form would be ambiguous, so Remotion refuses it.

Source

Thrown at packages/core/src/interpolate.ts:774

}): string => {
	const initiallyParsedOutputRange = outputRange.map(
		parseStringInterpolationValue,
	);
	const hasAxisRotation = initiallyParsedOutputRange.some(
		(parsed) => parsed.axisRotation,
	);
	const parsedOutputRange = hasAxisRotation
		? initiallyParsedOutputRange.map((parsed) => {
				if (parsed.kind !== 'rotate') {
					return parsed;
				}

				if (parsed.axisRotation) {
					return parsed;
				}

				if (parsed.dimensions !== 1) {
					throw new TypeError(
						'Cannot interpolate a multi-angle rotate value with an axis rotation',
					);
				}

				return {
					kind: 'rotate' as const,
					values: [0, 0, 1, parsed.values[0]] as [
						number,
						number,
						number,
						number,
					],
					units: [null, null, null, parsed.units[0]] as [
						null,
						null,
						null,
						string | null,
					],

View on GitHub (pinned to 78fe4bb3fd)

Solutions

Make every output an axis rotation: "0 0 1 45deg" instead of "45deg 30deg", paired with "1 0 0 60deg".
Or make every output a plain 1-angle rotate: "45deg" and "60deg" (then it auto-promotes to z-axis rotation).
Avoid 2-3 angle rotate forms entirely; they are uncommon and combine poorly with axis rotations.

Example fix

// before
interpolate(t, [0, 1], ["45deg 30deg", "1 0 0 60deg"]);
// after
interpolate(t, [0, 1], ["0 0 1 45deg", "1 0 0 60deg"]);

Defensive patterns

Strategy: validation

Validate before calling

function isAxisRotationForm(value: string): boolean {
  const parts = value.trim().split(/\s+/);
  if (parts.length === 2 && /^(x|y|z)$/i.test(parts[0])) return true;
  if (parts.length === 4) {
    const axis = parts.slice(0, 3).map(Number);
    return axis.every(Number.isFinite);
  }
  return false;
}

function rotateDimensions(value: string): number {
  return value.trim().split(/\s+/).length;
}

const hasAxis = outputRange.some((o) => typeof o === 'string' && isAxisRotationForm(o));
if (hasAxis) {
  outputRange.filter((o) => typeof o === 'string').forEach((o) => {
    if (!isAxisRotationForm(o) && rotateDimensions(o) > 1) {
      throw new Error(`Multi-angle rotate "${o}" cannot mix with axis rotations`);
    }
  });
}

Prevention

When mixing 2D and 3D rotations, express every output as an axis rotation ("0 0 1 angle").
Avoid 2- or 3-angle rotate forms; they don't combine with axis rotations.

When it happens

Trigger: interpolate(input, inputRange, outputRange) where one element parses as an axis rotation and another as a multi-angle rotate, e.g. ["45deg 30deg", "1 0 0 60deg"] or ["x 0deg", "10deg 20deg"].

Common situations: Animating between a 2D planar rotation and a 3D axis rotation; mixing rotateX/Y/Z syntax with multi-angle rotate syntax in the same call.

Related errors

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