82

Google Fonts seems to only offer fonts in WOFF2.

While this works fine with Chrome, WOFF2 doesn't seem to be supported by many other browsers

Is there a way to directly link to Google fonts hosted on their CDN in a format other than WOFF2?

6
  • 1
    Check this for everything.
    – The Alpha
    Nov 11, 2014 at 21:31
  • 3
    Google serves the file according to the browser, so in most modern browsers you'll get the woff2 version. Use curl to get the woff file: curl 'https://fonts.googleapis.com/css?family=Karla' Apr 17, 2018 at 18:46
  • 3
    This question is closed now (SO really has to change its policy) but the best answer to this question is this free app google-webfonts-helper.herokuapp.com/f Aug 7, 2018 at 16:13
  • 1
    Daniel Bang, this did not work for me, I just got CSS for the TTF font.
    – Andy Swift
    May 7, 2019 at 8:04
  • @DanielBang … as noted above, the curl command downloads files depending on the header and otherwise TTF. Nov 1, 2022 at 16:37

4 Answers 4

132

Unfortunately Google does not offer an easy way to directly download fonts. You can browse the git repository to search for the file you want, though there are only TTF files on GitHub available.

Also, do not directly link to the GitHub hosted fonts in your CSS! GitHub serves the files with the wrong mime type, which causes issues in some browsers.

While there is not a mainstream CDN for all the formats, you can use http://google-webfonts-helper.herokuapp.com to download the font files and host them yourselves.

10
31

When I open the following URL in Chrome, I get a link to the font in woff2 format. When I use Firefox, it's in woff format and in an Android device running pre-4.4, it is in ttf format.

http://fonts.googleapis.com/css?family=Open+Sans

So it appears that Google delivers fonts in a format appropriate to the requesting user-agent.

4
  • 3
    I'm accessing that in Firefox, and the fonts are in woff2 format. Maybe the situation for FF has changed?
    – halfer
    May 15, 2017 at 22:23
  • I tried this in safari just now and got 'woff' vs 'woff2' for chrome -- seems to be working. @halfer my firefox supports woff2.
    – amwinter
    May 24, 2017 at 5:29
  • This is a handy shortcut. Wish google would add format options to the downloads. Another work-around, since I don't see it mentioned anywhere else on this question, is to download the .ttf from Google, and upload it to Font Squirrel's webfont generator: fontsquirrel.com/tools/webfont-generator which will convert your font to whichever web format you need. May 9, 2018 at 22:25
  • 1
    this is the definite answer. By doing something like curl "http://fonts.googleapis.com/css?family=Roboto" -H 'User-Agent: Mozilla/5.0 Firefox/90.0' you get the CSS generated with woff2 links, whereas passing old versions like curl "http://fonts.googleapis.com/css?family=Roboto" -H 'User-Agent: Mozilla/5.0 Firefox/30.0' output the older woff format. Nov 1, 2022 at 16:32
8

Another option is using the following (node) gulp package: gulp-google-webfonts.

Once installed it takes moments to install fonts and create corresponding css.

Note that when installing a Google Font with whitespace in the name, (you don't escape it) reference it with the plus sign as follows:

fonts.list

Cabin+Sketch:400
5

You can use everythingfonts.com to convert the ttf file to a woff file.

1

Not the answer you're looking for? Browse other questions tagged or ask your own question.