How can I add a .ttf file as a custom font?

[ausome]

Whenever I upload my font file as an asset, it counts it as an image. How can I upload a custom font and use it in CSS?

[Jhondoe2122]

I think it’s just a normal .ttf file in the assets page because mine looks like this

I think it’s just a placeholder image they put over it

[jenn]

HI @Jhondoe2122 - if you want that asset in your app folder, open the terminal and run wget [asset url here] and it will download the file. Then run refresh so it will show up in the editor sidebar.

[ausome]

I found that you can just upload the asset and use font-face. Thanks anyway.

Edit: For anyone who went to this forum page because they wanna do this too, I’ll show you.
In your styling sheet, implement this base I designed:

@font-face {
        font-family: "Font Family Name";
        src: url("https://website.com/coolfont.otf");
      }

Let’s use Futura PT Extrabold as our example.

Basically, upload your .otf or .ttf file as an asset, get the link, go to your stylesheet, make a font face for said font, with the link and name, and then use it as the font-family on your element. Just in case, i would add fallback fonts.

[ausome]

Yeah, that placeholder was what was confusing me initially.