font-awesome markers

a week ago
New Contributor II


I'd like to use font awesome icons as markers. I'm using arcgis 4.24.5.

i tried to follow this exmaple from @ReneRubalcava  but it is not working

i'm seeing  this error in the console

request.js:5 GET 404

Not sure why it's looking for a pbf file on

Does anyone have an example for how to use font awesome icons as symbols in a graphic?

Thank you.


Tags (3)
0 Kudos
3 Replies
Esri Regular Contributor

That Rene sample is 7 years old with a very different version of the JavaScript API.  It does not apply to recent versions.

For symbolizing points, you have four options: SimpleMarkerSymbol , PictureMarkerSymbol , TextSymbol and CIMSymbol .  

To specify a font for TextSymbol for clientside layers, the fonts supported depends on if you are using SceneView or MapView.  For SceneView, the font needs to be installed on the client machine.  For MapView, supported fonts are hosted on  Based on your error it seems like you are using MapView.  The supported fonts are listed at has more info about font support.

New Contributor II

Hi Bjorn

Thank you for your reply.

Yes I am using Mapview.

Since font awesome is not listed as a supported font I guess there's no way to use it with a TextSymbol?

I have one solution but don't like it very much. I download the svg file from fontawesome web site and put it into my public folder (e.g. mine is called truck-solid.svg) then use it like this this

      const track = new Track({
        view: view,
        graphic: new Graphic({
          symbol: {
            type: "picture-marker",
            size: "12px",
            color: "green",
            url: "truck-solid.svg",
            outline: {
              color: "#efefef",
              width: "1.5px"
        useHeadingEnabled: false
Any better solutions for using fontawesome would be appreciated.
Thank you
0 Kudos
Esri Regular Contributor

Hi @FabianHanggi, unfortunately, Bjorn is correct and there is not a good way to use font awesome in a 2D MapView. It would work in a 3D SceneView as described in the Labeling guide page.

0 Kudos