Using R Quarto With Mermaid and FontAwesome Does Not Render Icons

Question

I am trying to include FontAwesome icons in R Quarto. I am rendering to a presentation in PPTX. However, it does not matter which presentation final type I select or any other output type. Sample code to replicate issue:

```{mermaid}
flowchart TD
    B["fab:fa-twitter for peace"]
    B-->C[fa:fa-ban forbidden]
    B-->D(fa:fa-spinner)
    B-->E(A fa:fa-camera-retro perhaps?)
```

The nodes render but none of the fa:* items are showing. I see the class is created in the HTML (if rendered to Reveal.JS or HTML):

<i class="fab fa-twitter"></i>

How can I get R Quarto (or other R markdown) using mermaid to include the font awesome icons?

Answer 1

You may want to look at the fontawesome extension which works at least for HTML outputs. I assume that by initializing in the text instead of only using the mermaid environment, it has the necessary HTML font awesome dependency to render the icons correctly.

---
format: html
---

Initialize {{< fa thumbs-up >}} and then it should work:

```{mermaid}
flowchart TD
    B["fab:fa-twitter for peace"]
    B-->C[fa:fa-ban forbidden]
    B-->D(fa:fa-spinner)
    B-->E(A fa:fa-camera-retro perhaps?)
```