TiddlyWiki 5 Style using local font file

[Duarte Farrajota Ramos]

After lots struggling, searching and researching, I finally found a working solution, which I am posting it here just for future reference to help out anyone who might want to do the same.

I have seen several posts here about using custom fonts under TiddlyWiki 5 most focus on external third party font services like Google Fonts or Font Awesome, some try embedding custom font files using base64 encodind inside the tiddlywiki file.

All I wanted was a simple way to use a locally installed external font file, preferably using a basic relative path.

Just create a new tiddler with whatever name you want, tag it with $:/tags/Stylesheet and add the following content to it, customizing where necessary

@font-face {
    font-family: myFontFamily;
    src: url(Font_File.ttf);
}


.tc-title{
  color: red;
  font-family: "myFontFamily" , sans-serif;
}

Adjust the src: url() part to a path pointing to your ttf otf or woff file, and adjust .tc-title to style whatever part of the wiki you wish.

Hope this helps anywome in the future