Objects

Here are the objects our GraphQL API supports.

Account

A Font Awesome account.

For the kit field:

For the iconCollection field:

Download

Information about the the download assets for a release.

IconCount

IconUpload

A icon that has been uploaded to a kit.

An "icon upload" is also sometimes called a "custom icon". They are icons that customers can upload to their own kits and use them just like any Font Awesome official icon.

As an i-tag

The name can suffice for building an <i> using Font Awesome CSS class names.

You also need a CSS class to specify the family-style for the icon.

The family-style class for a monotone icon upload is always either fak or fa-kit.

The family-style class for a duotone icon upload is always either fakd or fa-kit-duotone.

If pathData.length == 2, then it's a duotone, else monotone.

<i class="fa-kit fa-some-monotone-icon-name"></i> <i class="fa-kit-duotone fa-some-duotone-icon-name"></i>

Either of these could be added to a DOM that has either a Webfont/CSS or SVG/JS kit loaded.

As a CSS pseudo-element

Using the unicode, an icon could be referenced using a CSS pseudo-element

HTML:

<ul class="fancy-list">
  <li class="alpha">Chocolate</li>
  <li class="beta">Vanilla</li>
</ul>

Suppose you want to use some monotone icon upload for .alpha and some duotone icon for .beta.

CSS:

.fancy-list {
  list-style-type: none;
  margin-left: 2.5em;
  padding-left: 0;
}
.fancy-list .alpha:before {
  content: '\e001';
  font-family: 'Font Awesome Kit';
  margin-right: 0.25em;
}
.fancy-list .beta:before {
  content: '\e002';
  font-family: 'Font Awesome Kit Duotone';
  margin-right: 0.25em;
}

(Replace e001 or e002 with the unicode value as hex string: e.g. unicode.toString(16).)

Note that the font-family for a monotone icon upload is always "Font Awesome Kit"; the font-family for a duotone icon upload is always "Font Awesome Kit Duotone".

More Examples

See also the examples below on getting an IconDefiniton or <svg> from an IconUpload.

Icon

A specific Font Awesome icon.

For the svgs field:

Authorization Scopes and Subscription Limits for the svgs Field

The auth token used for the query request authorizes the selection of a given family-style based on its Authorization Scopes and based on your Font Awesome subscription.

For example, the Classic Light family-style is only available when the auth token includes the svg_icons_pro scope. If the auth token has only the svg_icons_free scope, then Classic Light icons will not be returned by this field, regardless of the filter arg. Font Awesome Free SVGs require an auth token with the svg_icons_free scope.

Another example, if you have a Pro plan but do not have access to the Pro+ Collection, you won't be able to access those additional families and styles from the svgs field.

Reduce Query Complexity by Filtering SVG familyStyles

Selecting the svgs field with the default of all familyStyles will often result in a query that is too complex. Especially when selecting svgs for all icons under a release. Learn more about managing complexity here.

Here's an example of query that uses filter to include only the Sharp Light and Duotone Solid familyStyles:

query {
  release(version: "7.x") {
    icons {
      id
      svgs(filter: { familyStyles: [{ family: SHARP, style: LIGHT }, { family: DUOTONE, style: SOLID }] }) {
        width
        height
        pathData
      }
    }
  }
}

The values for family and style here are uppercase because they are enum variants. Only valid values are available as variants. See notes on the Family and Style types below.

IconsPaginated

A page of icons returned by Release.iconsPaginated or searchPaginated.

IconCollection

A grouping of Icon Packs available to a subscription plan.

An Icon Collection is the set of icons a customer's plan entitles them to, for a given Font Awesome version. It is the root of the graph returned by Account.iconCollection.

IconPack

A group of familyStyles with a common visual personality. For example: Classic, Sharp, Whiteboard, Notdog, or Jelly.

The grid is the invisible design surface; the canvas is the visible bounding box that includes a uniform padding on all four sides. The difference between them is the padding. An official icon may be designed to overflow the grid into the padding, but it will never overflow the canvas. Both grid and canvas are squares of equal height and width, so sourceGridHeight and sourceCanvasHeight also imply their respective widths.

IconCollectionSubset

A breakdown of which icons are present in each family-style of a subsetted Icon Collection.

It exposes two access patterns over the same underlying data:

• Selecting all familyStyles in the Icon Collection.
• Selecting a single family-style. Good for paginating the icons under the only subfield of each family-style. See more below.

For the familyStyleSubset field:

Selecting familyStyleSubsets { only(page: …, pageSize: …) { … } } applies the same pagination arguments to every entry in a single selection. To paginate each family-style independently in one round trip, use the singular familyStyleSubset(family, style) field with field aliases — for example:

solid: familyStyleSubset(family: "classic", style: "solid") { only(page: 1) { icons { id } } }
regular: familyStyleSubset(family: "classic", style: "regular") { only(page: 2) { icons { id } } }

A full aliased-pagination example is shown in the Icon Collection Example queries section.

FamilyStyleSubset

A subsetted family-style, containing only some icons.

Identifies either "this whole family-style is included in the collection" (when only is null) or "only these specific icons within this family-style are included" (when only is a paginated list).

For the only field:

VisualTag

A descriptive tag (for example "filled", "outlined", or "dimensional") applied to a family-style.

Each tag carries its own label icon so a UI can render a chip for the tag.

Icon Collection Example queries

A minimal query to retrieve the authenticated account's Icon Collection and the names of its Icon Packs:

{
  me {
    iconCollection {
      name
      label
      iconPacks {
        name
        label
      }
    }
  }
}

A query that paginates across two familyStyles independently in a single round trip, using field aliases on the singular familyStyleSubset(family, style) field. Each alias gets its own only(page, pageSize) selection, so each family-style can be fetched at a different page. The outer subset resolves to null for collections that include every icon of every included family-style (such as the Pro Collection); the aliased selections inside subset only return populated results for collections that carry a curated subset (such as the Free Collection):

{
  me {
    iconCollection {
      name
      subset {
        classicSolid: familyStyleSubset(family: "classic", style: "solid") {
          familyStyle {
            family
            style
            prefix
          }
          only(page: 1, pageSize: 10) {
            page
            pageSize
            totalIconCount
            totalPageCount
            icons {
              id
            }
          }
        }
        classicRegular: familyStyleSubset(family: "classic", style: "regular") {
          familyStyle {
            family
            style
            prefix
          }
          only(page: 3, pageSize: 10) {
            page
            pageSize
            totalPageCount
            icons {
              id
            }
          }
        }
      }
    }
  }
}

License

An enum of license filters for icons.

The license filter accepts free or pro. free returns only icons that ship with Font Awesome Free. pro returns only icons that are exclusive to Font Awesome Pro — it is not a superset of Free. free and pro are intentionally disjoint sets. To retrieve the full superset of icons regardless of license, omit the parameter (in GraphQL, this corresponds to the enum value ANY).

SvgsFilter

An object declaring which familyStyles to include in an svgs filter.

FamilyStyleFilter

An object declaring a single family-style to include in an svgs filter.

Family

An enum with variants corresponding to Font Awesome official families.

These are the only values that are allowed for family in SvgsFilter.

• CLASSIC
• DUOTONE
• SHARP
• SHARP_DUOTONE
• WHITEBOARD
• THUMBPRINT
• SLAB_PRESS
• SLAB
• NOTDOG
• NOTDOG_DUO
• JELLY
• JELLY_FILL
• JELLY_DUO
• ETCH
• CHISEL

Style

An enum with variants corresponding to Font Awesome official styles.

These are the only values that are allowed for style in SvgsFilter.

• BRANDS
• DUOTONE
• LIGHT
• REGULAR
• SOLID
• THIN
• SEMIBOLD

Svg

The SVG data for a specific Font Awesome icon, in one family-style.

The various separate fields can be used to construct an <svg> HTML element or an IconDefinition for use in the Font Awesome JavaScript API. Alternatively, the html field provides a fully formed <svg> HTML element, and the iconDefinition field provides a fully formed JSON object that can be used as an IconDefinition in the JavaScript API.

Constructing an IconDefinition

You might want an IconDefinition for use in the JavaScript API or the React component, for example. You could get that by simply selecting the iconDefinition field. Or you could construct one from the component parts.

// For a monotone icon, the path used in an IconDefinition is just a string.
// For a duotone icon, it's a list, with the secondary path appearing first.
// The pathData field selected from the GraphQL API is always a list.

const path = pathData.length == 1 ? pathData[0] : pathData

// If using `width` and `height` from an `IconUpload`, those types are `String`
// and must be parsed as numbers when using in an `IconDefinition`.
// The svgs field returns integers for width and height.
// This is one way to ensure they are parsed as numbers, in some context where
// you might get properties for either.

const widthInt = +width
const heightInt = +height

const someIconDefinition = {
  "prefix": `${prefix}`,
  "iconName": `${name}`,
  "icon": [
    widthInt,
    heightInt,
    [], // no ligatures
    unicodeHex,
    path
  ]
}

// React component
<FontAwesomeIcon icon={ someIconDefinition }/>

Or an abstract:

import { icon } from '@fortawesome/fontawesome-svg-core'

icon(someIconDefinition).abstract

Constructing SVG elements

You might want an <svg> element for an SVG. You could get that by selecting the html field. This is formatted in the standard way all Font Awesome SVGs are formatted, including any styling necessary for duotone SVGs.

Or you could construct an <svg> element from the component parts like the following example.

Notice that monotone and duotone SVGs are constructed quite differently. You can detect whether it's a monotone or duotone SVG by its pathData. When pathData has length == 1, the one element is the primary path of a monotone SVG. When it has length == 2, the elements are [secondary, primary]. A secondary path is always written first.

const isDuotone = pathData.length == 2

const svg = isDuotone
  ? `<svg viewBox="0 0 ${width} ${height}">
        <path d="${pathData[0]}"/>
        <path d="${pathData[1]}"/>
    </svg>`
  : `<svg viewBox="0 0 ${width} ${height}">
        <path d="${pathData[0]}"/>
    </svg>`

To make the SVG work with Font Awesome's support styling, add class="svg-inline--fa" and load the svg-with-js.css stylesheet.

Kit

Metadata about a Font Awesome Kit.

For the searchKit field:

Searches icons in a kit. When a kit is subsetted, searching official icons is limited to the kit's subset and account permissions. Each call searches only official Font Awesome icons, in the OFFICIAL search mode, or custom icons (also known as "icon uploads") in the CUSTOM search mode. To search both in a single request, select the field more than once using GraphQL aliases.

Example:

Suppose we have a Pro kit on an account with a Pro plan, identified by token b75bd6c2d2. The kit includes the Classic Light family-style in its subset (an "auto" subset, also known as "By Style" subset). It also has two custom icon uploads: dragonfruit and dragon-claw.

The icons field on the returned SearchKitResult is a SearchKitIcon union, so an inline fragment is used to select fields by concrete type. In OFFICIAL mode, results are always IconWithVariants objects. In CUSTOM mode, results are always IconUpload objects. Select only the fragment that matches the chosen searchMode.

Searching official icons (searchMode: OFFICIAL)

Search official Font Awesome icons in this kit matching "dragon":

query {
  me {
    kit(token: "b75bd6c2d2") {
      searchKit(query: "dragon", page: 1, pageSize: 3, searchMode: OFFICIAL) {
        page
        pageSize
        totalIconCount
        totalPageCount
        icons {
          __typename
          ... on IconWithVariants {
            name
            label
            unicodeHex
            variants {
              familyStyle {
                family
                style
                prefix
                shorthand
              }
            }
          }
        }
      }
    }
  }
}

{
  "data": {
    "me": {
      "kit": {
        "searchKit": {
          "page": 1,
          "pageSize": 3,
          "totalIconCount": 67,
          "totalPageCount": 23,
          "icons": [
            {
              "__typename": "IconWithVariants",
              "label": "Dragon",
              "name": "dragon",
              "unicodeHex": "f6d5",
              "variants": [
                {
                  "familyStyle": {
                    "family": "classic",
                    "prefix": "fal",
                    "shorthand": "light",
                    "style": "light"
                  }
                }
              ]
            },
            {
              "__typename": "IconWithVariants",
              "label": "Dice D8",
              "name": "dice-d8",
              "unicodeHex": "f6d2",
              "variants": [
                {
                  "familyStyle": {
                    "family": "classic",
                    "prefix": "fal",
                    "shorthand": "light",
                    "style": "light"
                  }
                }
              ]
            },
            {
              "__typename": "IconWithVariants",
              "label": "Dice D6",
              "name": "dice-d6",
              "unicodeHex": "f6d1",
              "variants": [
                {
                  "familyStyle": {
                    "family": "classic",
                    "prefix": "fal",
                    "shorthand": "light",
                    "style": "light"
                  }
                }
              ]
            }
          ]
        }
      }
    }
  }
}

Notice how the "light" shorthand illustrates the legacy-naming behavior documented on FamilyStyle.shorthand: a style-only shorthand implies the Classic family. Also notice that variants contains only the familyStyles available through this Kit, filtered by both the Kit's subset and its Account's permits. It doesn't include dragon for classic-solid, sharp-light, utility-semibold, or any other family-style because this Kit's subset is limited to Classic Light.

Searching custom icons (searchMode: CUSTOM)

Search the kit's custom icon uploads for names matching "dragon":

query {
  me {
    kit(token: "b75bd6c2d2") {
      searchKit(query: "dragon", page: 1, pageSize: 3, searchMode: CUSTOM) {
        page
        pageSize
        totalIconCount
        totalPageCount
        icons {
          __typename
          ... on IconUpload {
            name
            unicodeHex
          }
        }
      }
    }
  }
}

{
  "data": {
    "me": {
      "kit": {
        "searchKit": {
          "page": 1,
          "pageSize": 3,
          "totalIconCount": 2,
          "totalPageCount": 1,
          "icons": [
            {
              "__typename": "IconUpload",
              "name": "dragonfruit",
              "unicodeHex": "e002"
            },
            {
              "__typename": "IconUpload",
              "name": "dragon-claw",
              "unicodeHex": "e003"
            }
          ]
        }
      }
    }
  }
}

Both of the kit's custom uploads — dragonfruit and dragon-claw — match, so totalIconCount is 2 and they fit on a single page.

KitDownload

An object representing the result of a kit download request.

A kit download request is initiated by the createKitDownload mutation, and its status can be polled by the getKitDownload field. Both return this object as a response. When the corresponding kit download is ready, the url field of this object will contain the link to download the kit, and the status field will be READY.

KitDownloadStatus

An enum showing the status of a kit download request.

BuildType

An enum of the possible build types for kit download.

IconWithVariants

A Font Awesome official icon with a set of its family-style variants, as filtered by the context of selection.

Its variants field contains only the family-style available in the selection context. If selected under a subsetted Kit, the variants are filtered by the Kit's subset and the Account's permits.

IconVariant

One family-style variant of a IconWithVariants with its SVG data (when permitted).

SearchKitResult

A page of results returned by Kit.searchKit.

SearchKitIcon

A union type representing any icon that can appear in a SearchKitResult.

A SearchKitIcon is one of:

• IconWithVariants — an official Font Awesome icon available in the kit, with its family-style variants.
• IconUpload — a custom icon uploaded to the kit.

Because this is a union, consumers must use inline fragments to select fields by concrete type:

icons {
  __typename
  ... on IconWithVariants {
    name
    label
    unicodeHex
    variants {
      familyStyle {
        shorthand
      }
    }
  }
  ... on IconUpload {
    name
    unicodeHex
  }
}

KitSearchMode

An enum of search options for Kit.searchKit.

Membership (Deprecated)

As of Font Awesome 6.2.0, use the familyStylesByLicense field of type FamilyStylesByLicense, which is family-aware, including the Sharp family.

Objects of this type include only legacy style names. They never include the family-style of "Sharp Solid", for example.

Indicates for each license type, in which legacy styles this icon appears.

FamilyStyle

A combination of family and style.

As of Font Awesome 6.2.0, every style is in a family. The original legacy Font Awesome styles - Solid, Regular, Light, and Thin - are in the Classic family.

Custom icons (also known as iconUploads) have a family of "kit" for monotone icons, or "kit-duotone" for duotone icons. Both have a style of "custom". They never have visual tags.

The combination of family and style distinctly identifies a Font Awesome family-style. A single prefix also distinctly identifies a family-style. Therefore, maps could be created, mapping in either direction:

prefix => {family, style}

{family, style} => prefix

Duotone is its own family. One style was introduced to that family in Font Awesome 5: Duotone Solid.

Brands is a style in the Classic family.

Here's an example of the Duotone (Solid) FamilyStyle object:

{
family: "duotone",
style: "solid",
prefix: "fad",
shorthand: "duotone"
}

An example for (Classic) Brands:

{
family: "classic",
style: "brands",
prefix: "fab",
shorthand: "brands"
}

An example for Sharp Solid:

{
family: "sharp",
style: "solid",
prefix: "fass",
shorthand: "sharp-solid"
}

An example for Kit Custom:

{
family: "kit",
style: "custom",
prefix: "fak",
shorthand: "kit"
}

An example for Kit Duotone Custom:

{
family: "kit-duotone",
style: "custom",
prefix: "fakd",
shorthand: "kit-duotone"
}

FamilyStylesByLicense

Indicates for each license type, in which families and styles this icon appears.

ProCdnReferrers

Collection of domains that have been whitelisted for Pro CDN usage associated with the authenticated account.

Release

Metadata about a given release of Font Awesome, identified by version.

For the icon field:

For the iconsPaginated field:

Example:

This returns three icons from page 123 in version 7.2.0, along with pagination metadata.

query {
  release(version: "7.2.0") {
    iconsPaginated(page: 123, pageSize: 3) {
      page
      pageSize
      totalIconCount
      totalPageCount
      icons {
        id
        label
        unicode
      }
    }
  }
}

{
  "data": {
    "release": {
      "iconsPaginated": {
        "page": 123,
        "pageSize": 3,
        "totalIconCount": 4318,
        "totalPageCount": 1440,
        "icons": [
          { "id": "binoculars", "label": "Binoculars", "unicode": "f1e5" },
          { "id": "biohazard", "label": "Biohazard", "unicode": "f780" },
          { "id": "bird", "label": "Bird", "unicode": "e469" }
        ]
      }
    }
  }
}

Selecting Icons By Name

Use the icon field on a release object to select a specific icon by name.

For fuzzy searching that includes word associations, beyond simple text matching on icon names, use the search field.

You can use either an icon's id or any of its name aliases as the value of the icon field's name argument. It must match exactly.

For example, this will select the mug-saucer icon with its unicode:

query {
  release(version: "7.x") {
    icon(name: "mug-saucer") {
      id
      unicode
    }
  }
}

Multiple icons may be selected using GraphQL aliases The following query will select a few icons by name, with their iconDefinitions, for all available familyStyles:

query {
  release(version: "7.x") {
    mugSaucer: icon(name: "mug-saucer") {
      id
      svgs {
        iconDefinition
      }
    }
    coffee: icon(name: "coffee") {
      id
      svgs {
        iconDefinition
      }
    }
    cookie: icon(name: "cookie") {
      id
      svgs {
        iconDefinition
      }
    }
  }
}

Results will look like:

{
  "data": {
    "release": {
      "coffee": {
        "id": "mug-saucer",
        "svgs": [...]
      },
      "cookie": {
        "id": "cookie",
        "svgs": [...]
      },
      "mugSaucer": {
        "id": "mug-saucer",
        "svgs": [...]
      }
    }
  }
}

Notice that two of them have the same id of mug-saucer. That's because "coffee", the name selected for the coffee object, is an alias for "mug-saucer": two names for the same icon.

Shim

A shim to support v4 syntax.

A shim helps to achieve compatibility with Font Awesome 4 icon references on a Font Awesome 5 or 6 installation. Ideally, users will upgrade all icon references to use the newer syntax. But Font Awesome 4 is still commonly in use, and is sometimes difficult to upgrade. Shims can ease the upgrade path.

Learn more about v4 compatibility.

What shims can do

1. Some icons that appear in Font Awesome 4 have been renamed. A shim can map the v4 icon name to the v5/6 icon name automatically.

2. For some v4 icons, their visual appearance matches the Regular style better than the Solid style. A shim can automatically change these icons to use the Regular style.

3. Font Awesome 5/6 puts all brand-related icons into a separate Brands style; Font Awesome 4 did not. A shim can map v4 brand icons into the Font Awesome 5 Brand style.

Examples

Icons with no shims

Examples of icons with no shims include "intersection" and "coffee".

The "intersection" icon first appeared in Font Awesome 5, and therefore has no shim.

The "coffee" icon appeared prior to Font Awesome 5/6, yet because its equivalent form in Font Awesome 5/6 is in the Solid (fas) style, and because that is the default style in Font Awesome 5/6, no shim is required.

Icons with shims

Examples of icons with shims include "bluetooth", "bath", and "address-book".

The "bluetooth" icon's name is the same in Font Awesome 4 and 5/6, but because it is a brand icon, and all brand icons appear in the Font Awesome 5 Brand (fab) style, the shim exists to map it into that style.

The "bath" icon in Font Awesome 5/6 is equivalent to the icon that was called "bathtub" in Font Awesome 4. The shim maps from the old name to the new name.

The "address-book" icon is equivalent to what was called "address-book-o" in Font Awesome 4. Its name change in Font Awesome 5/6 indicates a naming convention change. Instead of the "-o" in the icon name, indicating an "outline" style for some icons in Font Awesome 4, Font Awesome 5/6 has a Regular (far) style and all icons have Regular style variants.

Since the Regular (far) style is a non-default style in Font Awesome 5/6, the shim must not only map the icon's name from "address-book-o", but also its style into the Font Awesome 5/6 Regular (far) style.

SRI

A Subresource Integrity hash value for a CDN resource at a relative path.

For example, the value of the contents of css/all.css in Font Awesome 5.13.0 is:

sha384-Bfad6CLCknfcloXFOyFnlgtENryhrpZCe29RTifKEixXQZ38WheV+i/6YWSzkz3V

SrisByLicense

An Sri collection for a Font Awesome release, organized by license: free or pro.

The relative path css/all.css is valid on both the Free and Pro CDNs, but refers to two different resources with different contents, and therefore different hashes.

Aliases

Name and unicode aliases for a given icon.

Name Aliases

Name aliases are names for an icon, other than its id.

From time to time, an icon will be renamed. That is to say, its id is changed from one value to another. When this happens, for compatibility, the old id becomes a name alias. Thus, users or applications that have been using the older name for an icon, when updating to a new release, and continuing to use that older name, will continue to get the expected icon by that name.

For example, the icon with the id "mug-saucer" in Font Awesome 6.5.1 had an id of "coffee" in Font Awesome 5.15.4. When that icon was renamed to "mug-saucer", the name "coffee" was retained as an alias for the same icon. Therefore, for most use cases, the two names can be used interchangeably. For example, when using the names in CSS classes on HTML elements, in Font Awesome 6, the classes fa-coffee and fa-mug-saucer are equivalent.

UnicodeAliases

Unicode aliases are unicodes for an icon, or one of its duotone layers, other than the icon's main unicode. Values are hexadecimal.

For example, as of Font Awesome 6.5.1, the icon named credit-card has a main unicode of f09d. In Font Awesome 4.7.0 there was an icon class called fa-credit-card-alt with a unicode of f283. In recent versions of Font Awesome, there is no icon called credit-card-alt, but for the sake of compatibility, the credit-card icon has f283 as a unicode alias. That icon also has credit-card-alt as a name alias. Thus, when upgrading from Font Awesome 4 to Font Awesome 6, anywhere the f283 unicode or fa-credit-card-alt class are used will get the credit-card icon.

There are also unicode aliases to provide compatibility with some standard unicode values, such as those in the ASCII range, as might be keyed on a computer keyboard.

For example, the icon named at had a unicode value of f1fa in Font Awesome 4 and 5. As of Font Awesome 6, the unicodes for icons associated with many characters in the ASCII range--such as the characters of the English alphabet, numbers, punctuation, and some symbols--were changed to use their standard unicode values. The standard unicode value for the @ character is 0x40. So in Font Awesome 6, the at icon was given the unicode value of (hex) 40. But since it had been f1fa in previous releases, f1fa is retained as a unicode alias for the at icon.

There are also unicode aliases to provide compatibility with emoji standard unicode values.

For example, as of Font Awesome 6.5.1, the icon named face-grin has a unicode of f580. That icon also has a unicode alias of 1f600, because 1f600 is an emoji standard unicode value for one of the smiley emojis.

There are three types of unicode aliases: composite, primary, and secondary. The names of the unicode alias types have to do with icon layers.

Composite type aliases are unicodes that refers to a "whole" icon. This is the main type of unicode alias. It's the only type of unicode alias that's relevant to all icons.

A monotone icon has only one layer. That one layer comprises the "whole" icon. Thus, composite is the only type of unicode alias that's relevant to monotone icons.

A duotone icon may have both a primary and secondary layer (or it may have just one or the other). In Font Awesome 5, when the duotone style was introduced, for each icon, there were separate unicodes that referred to its primary and secondary layers. In order to render the "whole" icon, it was necessary to overlay the primary glyph on top of the secondary glyph. Each glyph was looked up by its corresponding unicode.

The primary and secondary unicode alias types refer to unicodes that were previously used to refer to the distinct layers of duotone icons. Thus, primary and secondary unicode aliases are only relevant to duotone icons.

Composite unicode aliases are also relevant to duotone icons, because in Font Awesome's Desktop OTF duotone fonts, duotone icons are encoded both "whole", as SVG glyphs (in the font's SVG table), as well as in separate glyphs for each layer (in the font's CFF table). The different types of glyphs are used in different use cases, usually depending on whether custom styling needs to be applied.

(Most applications that support SVG fonts do not allow custom styles to be applied to SVG glyphs, but will allow custom styles to be applied to each standard glyph. See Duotone Icons on the Desktop for more info.)

SVG duotone glyphs include the whole icon--both layers properly aligned with the default styling. They are addressable using a single unicode: either the icon's main unicode, or any composite unicode alias.

Duotone icons introduced in Font Awesome 6 do not have distinct unicodes assigned to their secondary layers, nor do they have secondary unicode aliases. As of Font Awesome 6, the normal way to lookup duotone secondary layers in both webfonts and desktop OTF fonts is to use ligatures. Ligatures are the only way to lookup duotone secondary layers for icons introduced in Font Awesome 6.

So while it might look like there are secondary unicode aliases for all duotone icons, look closely! They're only available for those duotone icons that were introduced in Font Awesome 5, for compatibility.

See this blog post for more details and examples.

Deprecated

Release.icons

type: [Icon!]!

Accepts one optional argument:

Use Release.iconsPaginated instead. Release.icons is retained for backward compatibility.

Icon.unicode

type: String!

Value of the unicode, as a hexadecimal string. Use the unicodeInt or unicodeHex fields instead, which are more explicit about the format of the unicode value. The unicode field is retained for backward compatibility.

Icon.styles

type: [String!]!

List of Font Awesome legacy styles of this icon, i.e. "solid", "regular", "light", "thin", "duotone", or "brands". It does not any include any styles added since Font Awesome 6.2.0, when Sharp Solid was introduced and all styles were organized into families.

Use the familyStylesByLicense field instead.

Icon.membership

type: Membership!

An object describing the styles of this icon by license type (Free and Pro). Like the deprecated Icon.styles field, this does not include any styles introduced since Font Awesome 6.2.0, when Sharp Solid was introduced and all styles were organized into families.

Use the familyStylesByLicense field instead.

IconUpload.path

type: String!

Use the pathData field instead, which includes both primary and secondary paths for both monotone and duotone icons. The path field is only the primary path, which is insufficient for a duotone icon.

IconUpload.unicode

type: Int!

Value of the unicode, as an integer. Use the unicodeInt or unicodeHex fields instead, which are more explicit about the format of the unicode value. The unicode field is retained for backward compatibility.