I am trying to load fonts from google fonts with the following snippet
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700,700i" rel="stylesheet">
It loads following css
/* vietnamese */
@font-face {
font-family: 'Montserrat';
font-style: italic;
font-weight: 400;
src: local('Montserrat Italic'), local('Montserrat-Italic'), url(https://fonts.gstatic.com/s/montserrat/v10/-iqwlckIhsmvkx0N6rwPmv8zf_FOSsgRmwsS7Aa9k2w.woff2) format('woff2');
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Montserrat';
font-style: italic;
font-weight: 400;
src: local('Montserrat Italic'), local('Montserrat-Italic'), url(https://fonts.gstatic.com/s/montserrat/v10/-iqwlckIhsmvkx0N6rwPmj0LW-43aMEzIO6XUTLjad8.woff2) format('woff2');
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
The problem is it returns woff2 font format. Is there any way to load woff or ttf formats instead of woff2? Because the woff2 is not rendering properly in older browsers.
Google Fonts will do browser sniffing and attempt to serve up only the relevant font formats.
This means that the loaded CSS will be different depending on the browser that loads it.
They do support older browsers. In particular:
As google doesn't help us to directly download fonts, I didn't find a way to do this, but you can check this github repo to help you :
https://github.com/google/fonts/