Search code examples
material-uimkdocs

How to add MkDocs Material icons to templates?


MkDocs Material comes packaged with many icons, and makes it very easy to use them in markdown. You can put short-codes anywhere in your Markdown, and they render perfectly.

<!-- some markdown file -->
:smile:
:material-account-circle:

I can't seem to figure out how to use these icons in HTML templates however. How can the icons packaged with MkDocs Material be used in HTML templates?

<!-- an HTML template used to render markdown -->
<span class="octicon octicon-clippy"></span> <!-- doesn't work -->

Solution

  • Author here. I've just added a section to the documentation for how to use icons in templates: https://squidfunk.github.io/mkdocs-material/reference/icons-emojis/#using-icons-in-templates