remotion-dev/remotion · error · Error

useCurrentScale() was called outside of a Remotion context.

Error message

useCurrentScale() was called outside of a Remotion context.
This hook can only be called in a component that is being rendered by Remotion.
If you want to this hook to return 1 outside of Remotion, pass {dontThrowIfOutsideOfRemotion: true} as an option.
If you think you called this hook in a Remotion component, make sure all versions of Remotion are aligned.

What it means

useCurrentScale() reads CurrentScaleContext, PreviewSizeContext, and the video config. If any of those is missing the hook is outside a Remotion render. It throws unless you opted out via `{dontThrowIfOutsideOfRemotion: true}` or are inside an actual render pass (where it returns 1). The message also flags a possible version mismatch.

Source

Thrown at packages/core/src/use-current-scale.ts:121

	);

	React.useEffect(() => {
		const update = () => setPortalScale(getPortalNodeCurrentScale());
		update();

		return subscribeToPortalNodeCurrentScale(update);
	}, []);

	if (hasContext === null || config === null || zoomContext === null) {
		if (options?.dontThrowIfOutsideOfRemotion) {
			return 1;
		}

		if (env.isRendering) {
			return 1;
		}

		throw new Error(
			[
				'useCurrentScale() was called outside of a Remotion context.',
				'This hook can only be called in a component that is being rendered by Remotion.',
				'If you want to this hook to return 1 outside of Remotion, pass {dontThrowIfOutsideOfRemotion: true} as an option.',
				'If you think you called this hook in a Remotion component, make sure all versions of Remotion are aligned.',
			].join('\n'),
		);
	}

	if (hasContext.type === 'scale') {
		return hasContext.scale;
	}

	// Studio initially renders the composition into an unscaled offscreen portal.
	// Return the scale that the preview has actually committed to that portal.
	return portalScale;
};

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Call useCurrentScale() only inside components rendered by <Player> or a <Composition>.
  2. If you intentionally call it outside Remotion, pass `{dontThrowIfOutsideOfRemotion: true}` to get 1 back.
  3. Run `npx remotion versions` and dedupe so all @remotion/* packages resolve to one install.

Example fix

// before
const scale = useCurrentScale();

// after (outside Remotion)
const scale = useCurrentScale({dontThrowIfOutsideOfRemotion: true});
Defensive patterns

Strategy: fallback

Validate before calling

// If you must call it outside Remotion, opt out of the throw
const scale = useCurrentScale({dontThrowIfOutsideOfRemotion: true});

Try / catch

let scale = 1;
try {
  scale = useCurrentScale();
} catch (e) {
  if (/useCurrentScale/.test((e as Error).message)) scale = 1;
  else throw e;
}

Prevention

When it happens

Trigger: Calling useCurrentScale() in a component rendered outside <Player>/Studio, or calling it during SSR without the opt-out option, or when duplicate @remotion installs give different React context object identities.

Common situations: Sharing a scaling-aware component with a non-Remotion React app; rendering such a component in a unit test without a Player wrapper; bundler-resolved duplicate @remotion/core copies.

Related errors


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