How to select system font

[abdis99807366]

It seems I can only select font from TypeKit but I would like to select a system font FS Elliot bold.

[kglad]

are you creating an canvas/html5 project?

is that font installed on your computer where you're creating that project?

[ClayUUID]

The dropdown in the textfield properties labeled "Family:" should list every font installed on your system when you click it. What are you seeing?

[Colin Holgate]

The web font globe menu should have Google Fonts as well as TypeKit. You can't give away fonts, so the web fonts are only the ones that you're licensed to use. If you choose from the regular font list, the ones in your system, it will look correct to you and correct to anyone who also has the same font.

Using static text fields would solve the problem, then it can be any font you have installed. If the text has to be dynamic you would need to use a font from the web font list, or know for sure that the user has that font.

[Preran]

Hi Abdis,

Let us know if the answers provided managed to solve your issue. Feel free to mark the closest answer as correct.

Thanks,

Preran

[abdis99807366]

Hi all,

I think I confused myself and would like to re-word my question as follows:

How can I select a font name that exist on my system but will ultimately be hosted online. This is my current workflow.

I have FS Elliot font (with various weights) on my mac (see screenshot1).

I am interested in the Bold.

Within Animate, it appears I have to select the font family and then the style.

The ultimate goal is to host the font online (through Google Doubleclick Studio assets folder) and use CSS font family like this in my template code:

When I publish the Animate project, I keep having to do this

Am looking for a way to avoid step 4 so designers/animator don't have to go into code and make this required change.

[UDESCO · Accepted solution]

Hi Abdi,

You can use the following code in frame-script to avoid changing the text in the external file.

     this.cta_text.font = "13px 'FS Elliot Bold'";

in general: this.<text instance name>.font = "<text size> <font-family name as in css>";