remotion-dev/remotion · error · Error

The variable font does not have a style

Error message

The variable font ${meta.fontFamily} does not have a style ${style}

What it means

Variable fonts expose only the styles their fontFaces define (typically 'normal' and 'italic'). loadVariableFont() filters meta.variable.fontFaces by the requested style and throws this error when no font face matches, meaning the requested style string is not offered by this variable font.

Solutions

  1. Use a style that the font defines; inspect meta.variable.fontFaces to see available styles
  2. Use the default style ('normal') which most variable fonts provide
  3. If you need the italic style, load the corresponding static font via its loadFont() instead of the variable loader

Example fix

// before
await loadVariableFont(font, {style: 'italic', subsets: ['latin']});
// after
await loadVariableFont(font, {style: 'normal', subsets: ['latin']});
Defensive patterns

Strategy: validation

Validate before calling

const styles = new Set(font.meta.variable.fontFaces.map((f) => f.style));
if (!styles.has(requestedStyle)) {
  throw new Error(`${font.fontFamily} supports styles: ${[...styles].join(', ')}`);
}

Type guard

function hasStyle(meta: FontMeta, style: string): boolean {
  return !!meta.variable && meta.variable.fontFaces.some((f) => f.style === style);
}

Try / catch

try {
  await loadVariableFont(font, {style, subsets: ['latin']});
} catch (e) {
  if ((e as Error).message.includes('does not have a style')) {
    await loadVariableFont(font, {style: 'normal', subsets: ['latin']});
  } else throw e;
}

Prevention

When it happens

Trigger: Calling loadVariableFont() with a style value that the font's variable fontFaces do not include, e.g. loadVariableFont(meta, {style: 'italic'}) on a font that only has a 'normal' variable font face, or a typo like 'Normal'.

Common situations: Hard-coding style: 'italic' for fonts that ship italic only as static faces; mistyping the style string; copying a working call from one font to another font with fewer variable styles.

Understand the failure class

Background: Invalid enum value errors: "Unknown type", "Invalid scope", "must be one of" — when a string is not on the library's allowed list — this error's family across 23 libraries.

Related errors


AI-assisted analysis of remotion-dev/remotion@46a3a6bf13 (2026-09-18). Data as JSON: /api/errors/efc6465afc7ce64a. Report an issue: GitHub.

Appendix: source

Thrown at packages/google-fonts/src/base.ts:270

	options: FontLoadOptions & {subsets: string[]},
): {
	fontFamily: FontInfo['fontFamily'];
	axes: Record<string, {min: number; max: number}>;
	waitUntilDone: () => Promise<undefined>;
} => {
	if (!meta.variable) {
		throw new Error(`${meta.fontFamily} is not available as a variable font`);
	}

	if (options.subsets.length === 0) {
		throw new Error('Pass at least one subset to loadVariableFont()');
	}

	const fontFacesForStyle = meta.variable.fontFaces.filter(
		(fontFace) => fontFace.style === style,
	);
	if (fontFacesForStyle.length === 0) {
		throw new Error(
			`The variable font ${meta.fontFamily} does not have a style ${style}`,
		);
	}

	const availableSubsetKeys = fontFacesForStyle.map(
		(fontFace) => fontFace.subset,
	);
	const subsets = [
		...new Set(
			options.subsets.flatMap((requestedSubset) =>
				resolveFontSubsetKeys({
					availableSubsetKeys,
					metaSubsets: meta.subsets,
					requestedSubset,
				}),
			),
		),
	];

View on GitHub (pinned to 46a3a6bf13)