Streaming live at 10am (PST)

Use fonts from computer


#1

Hello,

Does anybody know how to use fonts from mac in webflow?

I want to use Helvetica Nova, which is in my computer already, but have to pay if I download it from the website.

any suggestions?

Thanks,

Ree


#2

Hey Ree!

If you have the font on your computer (In mac they are located in the Font Book app) you can upload it to the custom fonts tab in your site settings of the dashboard.


#3

I'm going to assume you have the license to the font.
Here's how I usually go about adding a typeface to my sites,

Head to FontSquirrel's Webfont Generator, upload the font there, and this will help to generate the webfonts – woff, eot, ttf/otf, svg.
Upload these to Webflow via the Custom Fonts tab as @jaidenleach has mentioned above.

The generation of webfont is to ensure maximum compatibility of the custom fonts on your website across all devices.

Hope this helps!

– C


#4

Yes as @Reply said, it's best to follow that process. I was presuming you had the web font copies on your mac.


#5

Hi @reejiang, what @jaidenleach and @Reply told you was correct smile I wanted to add, when you upload your custom fonts, to make sure to upload all the versions needed, .woff, .otf, .eot and ttf.

See this article: http://help.webflow.com/site-settings/fonts#upload-custom-font

Cheers,
Dave


#6

Thanks for all your replies, @jaidenleach, @Reply, @cyberdave.

This may be a silly question. I do see the fonts in my font book, but when I want to upload it to my webflow, I don't know how I can find them. It doesn't show up when I search. I can see Font Book as an application, but not sure how I can open it and see the fonts.

Hope I have explained myself clearly. Do any of you have any suggestions for me?

Thanks,
Ree


#7

You can try opening your fontbook, then copying them onto your desktop. From there, you can upload them into Webflow.

But just like @cyberdave said, "make sure to upload all the versions needed, .woff, .otf, .eot and ttf."

Also, not all fonts can be used as a webfont. I would suggest finding a font on https://www.google.com/fonts that is similar to what you need.

This would eliminate the need to upload custom fonts. smile

hope this helps


#8

Thanks a lot, @PixelGeek
I only see .ttc
does this mean I can not use it as a webfont?


#9

Yes. You cannot use that font. You'll need to find another that is compatible with all browsers.


#10

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.