Adding custom fonts to editor


I'm trying to add a custom font and imported the fonts folder into the project folder. I also added the @fontface for the font in styles.css

Yet I'm not able to work with the font in the editor. May I know how I can add a custom font to the editor?

All 6 Comments


You shouldn't need to edit the css file to add @fontface rules. A couple of things to check though:

1. Are you using a font in the .woff format?

2. Are you using the font name without the folder name. So for example if your font is in a folder called fonts so the relative path is fonts/myFont.woff, the font name that you should be using is just myFont. So when working with a TextSprite for example, you could set the Font value to "24px myFont"

Sorry Gio, I actually had it working but the light font weight did not give the particular effect like in the reference... so I thought the font was not applied.

It's working all right. I played around with Outline Width to get the bold font weight. I guess this is the best way to give a bold font weight? As I did not see any font weight related methods in TextSprites.


Depending on the font that you're using, it is possible that different font weights are included in your .woff file. In the TextSprite font field, you could try "24px myFont bold" to see if that's the case. Failing that, yes what you're doing should work.

Thanks Gio, appreciate the help. Outline width should suffice I guess.

Hey Gio, I ran into another small problem again. The editor has the font now and in the preview window it works. But when I download and host the project on a server and run it locally, the fonts are missing. It could be some small error but I'm stuck here. Can you please help?

Hey, got this working. Since I ran on localhost I did have to use @fontface and name it the same as the .woff

Post a reply
Add Attachment
Submit Reply
Login to Reply