Loads a font and creates a p5.Font object. loadFont()
can load fonts in either .otf or .ttf format. Loaded fonts can be used to style text on the canvas and in HTML elements.
The first parameter, path
, is the path to a font file. Paths to local files should be relative. For example, '/assets/inconsolata.otf'
. The Inconsolata font used in the following examples can be downloaded for free here. Paths to remote files should be URLs. For example, 'https://example.com/inconsolata.otf'
. URLs may be blocked due to browser security.
The second parameter, successCallback
, is optional. If a function is passed, it will be called once the font has loaded. The callback function may use the new p5.Font object if needed.
The third parameter, failureCallback
, is also optional. If a function is passed, it will be called if the font fails to load. The callback function may use the error Event object if needed.
Fonts can take time to load. Calling loadFont()
in preload() ensures fonts load before they're used in setup() or draw().
Examples
Syntax
loadFont(path, [successCallback], [failureCallback])
Parameters
path of the font to be loaded.
function called with the p5.Font object after it loads.
function called with the error Event object if the font fails to load.