loadFontFromInfo()v4.0.279

Loads a Google Font based on some metadata that was obtained using getInfo().

getInfo() returns just a pure JSON object, so the metadata of a font may be loaded from a server, which can avoid having a heavy client-side bundle.

On the server
tsx
import {getInfo} from'@remotion/google-fonts/InterTight';
// Return `info` to the client using an endpoint
constinfo=getInfo();

On the client
tsx
constinfo=awaitloadInfoFromServer();
const {fontFamily, waitUntilDone} =loadFontFromInfo(info, 'italic');
console.log(fontFamily);
waitUntilDone();

API

The API is the same as loadFont(), except that another argument needs to be passed in first position, that being font metadata loaded using getInfo().

MyComp.tsx
tsx
import {getInfo} from'@remotion/google-fonts/InterTight';
import {loadFontFromInfo} from'@remotion/google-fonts/from-info';
const {waitUntilDone} =loadFontFromInfo(getInfo(), 'normal', {
 weights: ['400'],
 subsets: ['latin'],
});

Unlike loadFont(), there is no autocomplete

API​

See also​

API

See also