CODEWITHSUNDEEP
htmlcssfonts
resolute
resolute

Reputation: 301

Directly download font package instead of using <link href="" rel="stylesheet">

I won't be able to access internet on our hosting servers so I'm wondering if there's a way to download directly the font file instead of linking to the style sheet.

<style>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap" rel="stylesheet">
</style>

Much appreciated.

Upvotes: 0

Views: 411

Answers (1)

Jon Uleis
Jon Uleis

Reputation: 18649

Google Fonts has a "Download family" button atop each font page that provides a ZIP file with TTFs in each weight. Here's the page for Montserrat, the font used in your example: https://fonts.google.com/specimen/Montserrat

Using those files, you can set up your own local stylesheet that references the TTF files using @font-face rules, like the example below.

@font-face {
  font-family: "Montserrat";
  src: url("/fonts/Montserrat-Medium.ttf") format("ttf"),
}

Learn more, including how to assign different weights to variants like bold, at MDN and CSS-Tricks.

Upvotes: 1

Related Questions