Draft
This page is not complete.
This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The FontFace()
constructor creates a new FontFace
object.
var fontFace = new FontFace(family, source, descriptors);
font-family
descriptor of @font-face
.family
: Familystyle
: Styleweight
: Weightstretch
: StretchunicodeRange
: Unicode rangevariant
: variantfeatureSettings
: Feature settingsasync function loadFonts() { const font = new FontFace('myfont', 'url(myfont.woff)'); // wait for font to be loaded await font.load(); // add font to document document.fonts.add(font); // enable font with CSS class document.body.classList.add('fonts-loaded'); }
Specification | Status | Comment |
---|---|---|
CSS Font Loading Module Level 3 The definition of 'FontFace Constructor' in that specification. | Working Draft | Initial definition |
Desktop | ||||||
---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | |
Basic support | 35 | ? | 41 | ? | ? | ? |
Mobile | |||||||
---|---|---|---|---|---|---|---|
Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | iOS Safari | Samsung Internet | |
Basic support | 37 | 35 | ? | 41 | ? | ? | ? |
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/FontFace/FontFace