This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The FontFace interface represents a single usable font face. It allows control of the source of the font face, being a URL to an external resource, or a buffer; it also allows control of when the font face is loaded and its current status.
Constructor
FontFace()- Constructs and returns a new
FontFaceobject, built from an external resource described by an URL or from anArrayBuffer.
Properties
This interface doesn't inherit any property.
FontFace.display- Is a
CSSOMStringthat etermines how a font face is displayed based on whether and when it is downloaded and ready to use. FontFace.family- Is a
CSSOMStringthat contains the family of the font. It is equivalent to thefont-familydescriptor. FontFace.style- Is a
CSSOMStringthat contains the style of the font. It is equivalent to thefont-styledescriptor. FontFace.weight- Is a
CSSOMStringthat contains the weight of the font. It is equivalent to thefont-weightdescriptor. FontFace.stretch- Is a
CSSOMStringthat contains how the font stretches. It is equivalent to thefont-stretchdescriptor. FontFace.unicodeRange- Is a
CSSOMStringthat contains the range of code encompassed the font. It is equivalent to theunicode-rangedescriptor. FontFace.variant- Is a
CSSOMStringthat contains the variant of the font. It is equivalent to thefont-variantdescriptor. FontFace.featureSettings- Is a
CSSOMStringthat contains the features of the font. It is equivalent to thefont-feature-settingsdescriptor. FontFace.statusRead only- Returns an enumerated value indicating the status of the font. It can be one of the following:
"unloaded","loading","loaded", or"error". FontFace.loadedRead only- Returns a
Promiseto aFontFacethat fulfills when the font is completely loaded and rejects when an error happens.
Methods
This interface doesn't inherit any method.
FontFace.load()- Loads the font, returning a
Promiseto aFontFacethat fulfills when the font is completely loaded and rejects when an error happens.
Specifications
| Specification | Status | Comment |
|---|---|---|
| CSS Font Loading Module Level 3 The definition of 'FontFaceSet' in that specification. |
Working Draft | Initial definition |
Browser compatibility
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | 35 | 41 (41) | ? | ? | ? |
| Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic support | 35 | 35 | 41.0 (41) | ? | ? | ? | ? |

