Search code examples
font-awesomemkdocsmkdocs-material

How to use Fontawsome Pro icons in mkdocs material


I have purchased a License for the Fontawesome Pro Icons package and was wondering how I can use the pro library kit in mkdocs material? I currently use the free fonts like this, for example:

:fontawesome-solid-user-secret:

But I would like to use the "thin" version which is part of the pro package, like this:

:fontawesome-thin-user-secret:

How can I achieve that? TIA


Solution

  • First, declare a custom_dir in mkdocs.yml if you haven't already:

    theme:
      custom_dir: docs/.overrides  # Relative to mkdocs.yml. Can be whatever you want.
    

    Then download Font Awesome, extract it, and move the contents of the svgs directory (not including the folder itself) to {CUSTOM_DIR}/.icons/fontawesome. For example, if your custom_dir is docs/.overrides, you would move the contents of the svgs directory to docs/.overrides/.icons/fontawesome. Everything else that came with the download is safe to delete.

    Your custom_dir should look like this:

    .
    └── .icons/
        └── fontawesome/
            ├── brands
            ├── duotone
            ├── light
            ├── regular
            ├── sharp-regular
            ├── sharp-solid
            ├── solid
            └── thin
    

    You can then use Font Awesome Pro icons in the same way you already do the free ones (e.g. :fontawesome-thin-user-secret: will work as written).