remotion-dev/remotion · error · Error

<Solid>: `pixelDensity` must be a positive finite number. Re

Error message

<Solid>: `pixelDensity` must be a positive finite number. Received: ${String(pixelDensity)}.

What it means

The <Solid> effect component accepts an optional pixelDensity that scales the internal canvas resolution (useful for high-DPI output). The value must be a positive, finite number; undefined defaults to 1. Non-numbers, NaN, Infinity, zero, and negatives are rejected because they would produce an invalid or non-renderable canvas size.

Source

Thrown at packages/core/src/effects/Solid.tsx:60

type OptionalProps = {
	readonly color: string | undefined;
	readonly effects: EffectsProp;
	readonly className: string | undefined;
	readonly style: React.CSSProperties | undefined;
	readonly pixelDensity: number | undefined;
};

const resolveSolidPixelDensity = (pixelDensity: number | undefined): number => {
	if (pixelDensity === undefined) {
		return 1;
	}

	if (
		typeof pixelDensity !== 'number' ||
		!Number.isFinite(pixelDensity) ||
		pixelDensity <= 0
	) {
		throw new Error(
			`<Solid>: \`pixelDensity\` must be a positive finite number. Received: ${String(pixelDensity)}.`,
		);
	}

	return pixelDensity;
};

type InnerSolidProps = MandatoryProps &
	OptionalProps & {
		overrideId: string | null;
	};
export type SolidProps = MandatoryProps &
	Partial<OptionalProps> &
	InteractiveCropProps;

export const solidSchema = {
	...baseSchema,
	color: {

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Omit pixelDensity to use the default of 1.
  2. Pass a positive finite literal like pixelDensity={2}.
  3. Clamp/validate computed values: Math.max(0.0001, Number(density)) and ensure it is finite before passing.

Example fix

// before
<Solid pixelDensity={density} ... /> // density may be 0/NaN

// after
<Solid
  pixelDensity={
    typeof density === 'number' && Number.isFinite(density) && density > 0
      ? density
      : undefined
  }
  ...
/>
Defensive patterns

Strategy: validation

Validate before calling

const safeDensity =
  typeof pixelDensity === 'number' &&
  Number.isFinite(pixelDensity) &&
  pixelDensity > 0
    ? pixelDensity
    : undefined;

Type guard

const isValidPixelDensity = (d: unknown): d is number =>
  typeof d === 'number' && Number.isFinite(d) && d > 0;

Prevention

When it happens

Trigger: Passing <Solid pixelDensity={0} />, pixelDensity={-1}, pixelDensity={NaN}, pixelDensity={Infinity}, pixelDensity={'2'}, or a value computed from a division that can yield NaN/Infinity.

Common situations: Computing pixelDensity from window.devicePixelRatio (which can be 0 in some headless contexts); passing a string from a config; arithmetic that occasionally divides by zero.

Related errors


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