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