FontAwesome CSS

Nack's Avatar


05 Oct, 2019 05:41 PM

I am having a difficult time loading "_FontAwesome.ttf" font icons on the cards.
I understand that I can use .svg instead but would prefer to use them as fonts.
Thank you in advance.

CSS ----------
@font-face {font-family: fontAwesome; src: url("_FontAwesome.tff"); }

  1. Support Staff 1 Posted by Damien Elmes on 05 Oct, 2019 10:22 PM

    Damien Elmes's Avatar

    That looks correct - you will also need to ensure the file is in your media folder and your cards are using "fontAwesome". If it still doesn't work, it may be that the file is in the wrong format.

  2. 2 Posted by Nack on 06 Oct, 2019 05:20 AM

    Nack's Avatar

    Thanks, Damien. The file is in the media folder. Other fonts I have installed in the system work perfectly. I think the file is in the right format but not entirely sure. I will upload the _FontAwesome.ttf that I am using

    CSS ---------
    .targetIcon {font-family: fontAwesome; font-weight: 400; font-size: 25px;}

  3. Support Staff 3 Posted by Damien Elmes on 06 Oct, 2019 10:07 PM

    Damien Elmes's Avatar

    Hi Nack,

    The code you included here looks ok to me. I'm afraid if it's not working, the font may not be in a format Anki's web libraries accepts. If you try a different font file and that does work, that would seem to back up that assumption.

Comments are closed, but you can start a new discussion.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac