Font Awesome examples

Icon as Object (with title attribute—inspect the DOM to see it)

Icon looked up in library by name

Possible after adding the faUser icon from the free-solid-svg-icons package to the library.

The default prefix of fas is assumed. Also, add a border.

Icon with Non-default Style Prefix Using [prefix, iconName]

icon should be set equal to an array object with two string elements: the prefix and the icon name.

Using a string for an icon name also requires that this icon has been added to the library with library.add()

Icon as Object with non-Default Prefix

The icon object knows its own prefix, so the prefix is not specified in this case.

With Mask and Transform

Change Size

Animation

Click to toggle animation.

Slide to turn up the magic.

Layers

Custom icons created with multiple layers.

Using text as one of the layers.

Slide and increase the number.

When using text layer outside layers component

Expect to see an error on the JavaScript console, and nothing shown between these bars: ||

Intentionally Missing Icon

Expect to see an error on the JavaScript console, and nothing shown between these bars: ||