Skip to main content

measureText()

Part of the @remotion/layout-utils package.

Calculates the width and height of specified text to be used for layout calculations. Only works in the browser, not in Node.js or Bun.

API​

This function has a cache. If there are two duplicate arguments inputs, the second one will return the first result without repeating the calculation.

The function takes the following options:

text​

Required string

Any string.

fontFamily​

Required string

Same as CSS style font-family

fontSize​

Required number

Same as CSS style font-size. Only numbers allowed, unit px

fontWeight​

string

Same as CSS style font-weight

letterSpacing​

string

Same as CSS style font-spacing.

fontVariantNumericv4.0.57​

string

Same as CSS style font-variant-numeric.

Return value​

An object with height and width

Example​

tsx
import { measureText } from "@remotion/layout-utils";
 
const text = "remotion";
const fontFamily = "Arial";
const fontWeight = "500";
const fontSize = 12;
const letterSpacing = "1px";
 
measureText({
  text,
  fontFamily,
  fontWeight,
  fontSize,
  letterSpacing,
}); // { height: 14, width: 20 }
tsx
import { measureText } from "@remotion/layout-utils";
 
const text = "remotion";
const fontFamily = "Arial";
const fontWeight = "500";
const fontSize = 12;
const letterSpacing = "1px";
 
measureText({
  text,
  fontFamily,
  fontWeight,
  fontSize,
  letterSpacing,
}); // { height: 14, width: 20 }

See also​