This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Jordan Robert Dobson
Posted Mar 30 - Read on Facebook

FontFace Class Module


Here's a bit of code I've been using myself for a few months now. It allows you to load in custom typefaces into your prototypes with very little effort. There is some basic error checking and testing to validate the typeface was loaded.

Here's how simple it is to add to your prototypes:

gotham = new FontFace
 name: "Gotham"
 file: "Gotham.ttf"

Check out the demo above or you can grab just the module if you'd like.


Please let me know how it works for you, if you have any suggestions or if you find any errors / issues putting it to use.

Enjoy!    :D


Ban Nguyen

does not work on Framer Preview Jordan Robert Dobson.

Andrew Nalband

Ooh, and demoed with one of my favorite typefaces!

Weston Thayer

How do you feel about distributing stuff like this on npm? I could help rig it up.

Jonathan Lazarini

sweet :)

David Fumberger

Great work, thanks for this.

Jordan Robert Dobson

Sure thing David and Stefan... Let me know how it works out for you and if you have any troubles.

Chris Allen

Jordan Robert Dobson - thanks so much for this module! Works perfectly. One thing, though, you may want to swap out the gotham .ttf font file with an open-source font (possibly from Google fonts) in order to avoid any issues with Hoefler & Co...

Philippe Côté

Jordan Robert Dobson Wow! I was looking for this! Thank you very much! :)

Jordan Robert Dobson

I guess I should add this to

Read the entire post on Facebook