packages/docs/docs/google-fonts/get-available-fonts.mdx
import {AvailableFonts} from '../../components/AvailableFonts'
Part of the @remotion/google-fonts package
Array of all available fonts available in @remotion/google-fonts.
From v3.3.64 on, the font can be loaded individually by calling .load() if you are loading the function using ES Modules.
import { getAvailableFonts } from "@remotion/google-fonts";
console.log(getAvailableFonts());
[
{
fontFamily: "ABeeZee",
importName: "ABeeZee",
load: () => import("./ABeeZee"), // Available from v3.3.64
},
{
fontFamily: "Abel",
importName: "Abel",
load: () => import("./Abel"),
},
{
fontFamily: "Abhaya Libre",
importName: "AbhayaLibre",
load: () => import("./AbhayaLibre"),
},
];
fontFamily is how the name should be referenced in CSS.importName is the identifier of how the font can be imported: @remotion/google-fonts/[import-name].If you require() this module, it is not possible to dynamically load a font. This also applies to code that transpiles to using require() under the hood. Newer versions of Next.js, Vite and Astro are automatically configured to allow for lazy loading.