How to use a custom font?

[TimotheAlbouy]

I know that we can use the option.font property to change the font, but it only searches for web-safe fonts. How can I use a custom font that I stored on the server, let's say /public/fonts/Wurmics_Bravo.ttf?

[rubillionaire]

Using the FontFace API you can load a font, and then reference the name (first argument to FontFace) within your vectorize text options.

// load your font
const font = new FontFace('Fredoka', "url('fonts/Fredoka-SemiBold.ttf')")
await font.load()
document.fonts.add(font)
// make a mesh from it
const mesh = vectorizeText(char, {
  triangles: true,
  textBaseline: "alphabetic",
  font: 'Fredoka',
  size: '10px',
  textAlign: 'center',
})