To add support for mdi icons I used a combination of my themes ability to extend its header. And a simple shortcode:

1
2
3
4

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@mdi/font@7.4.47/css/materialdesignicons.min.css"
/>

1

<span class="mdi mdi-{{ .Get 0 }}"></span>
1

This is a mdi icon: {{< icon file >}}

This will then be rendered correctly and inline:

This is a mdi icon: