FontFace

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

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 FontFace object, built from an external resource described by an URL or from an ArrayBuffer.

Properties

This interface doesn't inherit any property.

FontFace.family
Is a DOMString that contains the family of the font. It is equivalent to the family descriptor.
FontFace.style
Is a DOMString that contains the style of the font. It is equivalent to the style descriptor.
FontFace.weight
Is a DOMString that contains the weight of the font. It is equivalent to the weight descriptor.
FontFace.stretch
Is a DOMString that contains how the font stretches. It is equivalent to the stretch descriptor.
FontFace.unicodeRange
Is a DOMString that contains the range of code encompassed the font. It is equivalent to the unicode-range descriptor.
FontFace.variant
Is a DOMString that contains the variant of the font. It is equivalent to the range descriptor.
FontFace.featureSettings
Is a DOMString that contains the features of the font. It is equivalent to the feature-settings descriptor.
FontFace.status Read only
Returns an enumerated value indicating the status of the font. It can be one of the following: "unloaded", "loading", "loaded", or "error".
FontFace.loaded Read only
Returns a Promise to a FontFace that 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 Promise to a FontFace that 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

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 35.0 41 (41) ? ? ?
Feature Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support No support 35.0 41.0 (41) ? ? ? ? 35.0

Document Tags and Contributors

 Contributors to this page: Alhadis, jpmedley, teoli
 Last updated by: Alhadis,