How to use a custom font in a project using GitHub?

So I’m trying to use a custom font file in one of my projects, and this method seems like the most promising. Not only that, but the URL given in that thread by TazExprez works perfectly in my project. But my url https://github.com/PatoLubricado/fccfiles/raw/main/fr-bold.ttf, while it downloads the font I uploaded when pasted on my browser, it doesn’t work when I try to use it in my Product Landing Page project. This is the rule that works for the other URL, but not mine:

@font-face {
  font-family: 'FuturamaFont';
  src: url('https://github.com/PatoLubricado/fccfiles/raw/main/fr-bold.ttf') format('truetype');
}

I tried other URL formats, like making it start with raw.githubusercontent.com, but none seem to work either. Any ideas of what I should do to get the font to work in the project? Thanks in advance.

Hi @PatoLubricado

I visited the url page and got a “page does not exist” error message.
Try searching Git for the font.

Happy coding

1 Like

Thanks, I’m stupid. I’d made my GitHub repository private, and I somehow didn’t guess that that means only I can download from it even with the URL. I changed my repository to public and it works perfectly now!

2 Likes

Hold on I’m stupider. That’s the fallback font, not the one I wanted. Downloading from GitHub is still not working, with the URL and code provided in the OP

Ok so the final solution was to use githack, the production URL, not the development one. So my working URL is: rawcdn.githack.com/PatoLubricado/fccfiles/main/fr-bold.ttf
(And after all this effort… I think the other font looks better :sweat_smile: but I did end up using this for a font selector into Alienese)