Laden Sie eine Google-Schriftart herunter und richten Sie eine Offline-Site ein, die sie verwendet

Check out google webfonts helfer

Sie können alle Web-Fonts von Google herunterladen und schlägt den CSS-Code für die Implementierung vor. Mit diesem Tool können Sie einfach alle Formate auf einmal ohne Probleme herunterladen.

Wollten Sie schon immer wissen, wo Google ihre Webfonts hostet? Dieser Service kann nützlich sein, wenn Sie alle .eot-, .woff-, .woff2-, .svg- und .ttf-Dateien einer Schriftartvariante direkt von Google herunterladen möchten (normalerweise bestimmt Ihr User-Agent das beste Format).

Schauen Sie sich auch ihre Github-Seite an.

Schritt für Schritt gefunden, um dies zu erreichen (für 1 Schriftart):
(Stand vom 09.09.2013)

1. Wählen Sie Ihre Schriftart unter http://www.google.com/fonts aus.
2. Fügen Sie Ihrer Sammlung den gewünschten hinzu, indem Sie die blaue Schaltfläche "Zur Sammlung hinzufügen" drücken
3. Klicken Sie auf die Schaltfläche "Alle Stile anzeigen" in der Nähe der Schaltfläche "Aus Sammlung entfernen", und stellen Sie sicher, dass Sie andere Stile ausgewählt haben, die Sie möglicherweise ebenfalls benötigen, z. B. "Fett".
4. Klicken Sie unten rechts auf der Seite auf die Schaltfläche "Verwenden"
5. Klicken Sie oben auf die Download-Schaltfläche mit einem Pfeil nach unten
6. Klicken Sie in der angezeigten Popup-Meldung auf "Zip-Datei"
7. Klicken Sie im Popup auf die Schaltfläche "Schließen"
8. Blättern Sie langsam durch die Seite, bis Sie die 3 Registerkarten "Standrd | @import | Javascript" sehen.
9. Klicken Sie auf die Registerkarte "@import"
10. Wählen Sie die URL zwischen 'url(' und ')' aus und kopieren Sie sie.
11. Kopiere es in die Adressleiste in einen neuen Tab und gehe dorthin
12. Führen Sie "Datei> Seite speichern unter ..." aus und benennen Sie sie "gewünschterFontname.css" (ersetzen Sie sie entsprechend).
13. Dekomprimieren Sie die heruntergeladene .Zip-Datei für Schriftarten (.ttf sollte extrahiert werden).
14. Wechseln Sie zu " http://ttf2woff.com/ " und konvertieren Sie alle von ZIP extrahierten .ttf-Dateien in .woff
15. Bearbeiten Sie desiredfontname.css und ersetzen Sie die darin enthaltene URL [zwischen 'url(' und ')'] durch die entsprechende konvertierte .woff-Datei, die Sie auf ttf2woff.com erhalten haben. Der Pfad, den Sie schreiben, sollte Ihrem Server doc_root entsprechen
16. Speichern Sie die Datei und verschieben Sie sie an den endgültigen Ort. Schreiben Sie den entsprechenden <link/>-CSS-Tag, um diese in Ihre HTML-Seite zu importieren
17. Verweisen Sie von nun an auf diesen Zeichensatz mit seinem font-family-Namen in Ihren Stilen

Das ist es. Weil ich das gleiche Problem hatte und die Lösung oben für mich nicht funktionierte.

Die anderen Antworten sind nicht falsch, aber ich habe festgestellt, dass dies der schnellste Weg ist.

1. Laden Sie die ZIP-Datei von Google-Schriftarten herunter und entpacken Sie sie.
2. Laden Sie die Zeichensatzdateien 3 gleichzeitig nach http://www.fontsquirrel.com/tools/webfont-generator
3. Laden Sie die Ergebnisse herunter.

Die Ergebnisse enthalten alle Schriftformate: woff, svg, ttf, eot.

UND als zusätzlichen Bonus generieren sie auch die CSS-Datei für Sie!

3 Schritte:

1. Laden Sie Ihre benutzerdefinierte Schriftart auf Goole Fonts herunter und laden Sie die .css-Datei herunter Ex: Download http://fonts.googleapis.com/css?family=Open+Sans:400italic600italic.400.600.300 Und speichern als example.css
2. Öffnen Sie die heruntergeladene Datei (example.css). Jetzt müssen Sie alle font-face-Dateien herunterladen und im Verzeichnis fonts speichern.
3. Bearbeiten Sie example.css: Ersetzen Sie alle Font-Face-Dateien in Ihren .css-Download

Ex: 

@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local('Open Sans Italic'), local('OpenSans-Italic'), url(http://fonts.gstatic.com/s/opensans/v14/xjAJXh38I15wypJXxuGMBvZraR2Tg8w2lzm7kLNL0-w.woff2) format('woff2');
  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

Schauen Sie sich src: -> url an. Laden Sie http://fonts.gstatic.com/s/opensans/v14/xjAJXh38I15wypJXxuGMBvZraR2Tg8w2lzm7kLNL0-w.woff2 herunter und speichern Sie das Verzeichnis fonts. Danach ändern Sie die URL Ihrer heruntergeladenen Datei. Jetzt wird es aussehen

@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local('Open Sans Italic'), local('OpenSans-Italic'), url(fonts/xjAJXh38I15wypJXxuGMBvZraR2Tg8w2lzm7kLNL0-w.woff2) format('woff2');
  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

** Laden Sie alle Schriftarten herunter, die die .css-Datei Enthalten. Ich hoffe, es hilft Ihnen

In diesem praktischen Artikel erfahren Sie, wie Sie Google-Schriftarten offline verwenden

Im Wesentlichen fügen Sie die Schrift in Ihr Projekt ein.

@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: normal;
src: url('path/to/OpenSans.eot');
src: local('Open Sans'), local('OpenSans'), url('path/to/OpenSans.ttf') format('truetype');

Wenn Sie Google Fonts verwenden, ist Ihr Workflow in 3 Schritte unterteilt: "Auswählen", "Anpassen", "Einbetten". Wenn Sie genau hinschauen, befindet sich am rechten Ende der Seite "Verwenden" ein kleiner Pfeil, mit dem Sie die aktuell in Ihrer Sammlung vorhandene Schriftart herunterladen können.

Danach und sobald die Schriftart auf Ihrem System installiert ist, müssen Sie sie wie jede andere normale Schriftart verwenden, die die CSS-Direktive font-family verwendet.

Ich folgte der Antwort von duydb , um den folgenden Python-Code zu erstellen, der diesen Prozess automatisiert. 

import requests

with open("example.css", "r") as f:
    text = f.read()
    urls = re.findall(r'(https?://[^\)]+)', text)

for url in urls:
    filename = url.split("/")[-1]
    r = requests.get(url)
    with open("./fonts/" + filename, "wb") as f: 
        f.write(r.content)
    text = text.replace(url, "/fonts/" + filename)

with open("example.css", "w") as f:
        f.write(text)

Hoffe, das hilft bei einigen der Copy-Paste-Tode. 

Wenn Sie Ihre Paketabhängigkeiten explizit deklarieren oder den Download automatisieren möchten, können Sie ein Knotenpaket hinzufügen, um die Google-Schriftarten aufzurufen und lokal zu bedienen.

npm - Google Font Downloads

Das Schriftarten-Projekt erstellt NPM-Pakete für Open Source-Schriftarten:

Jedes Paket wird mit allen erforderlichen Dateien und CSS geliefert, um eine Open-Source-Schriftart selbst zu hosten.
Alle Google-Schriftarten wurden hinzugefügt sowie eine kleine, aber wachsende Liste anderer Open-Source-Schriftarten.

Suchen Sie einfach mit npm nach typeface-<typefacename>, um die verfügbaren Schriftarten wie typeface-roboto oder typeface-open-sans zu durchsuchen und installieren Sie sie wie folgt:

$ npm install typeface-roboto    --save 
$ npm install typeface-open-sans --save 
$ npm install material-icons     --save 

npm - Google Schriftarten herunterladen -ers

Für den allgemeineren Anwendungsfall gibt es mehrere npm-Pakete, die Zeichensätze in zwei Schritten bereitstellen, indem zunächst das Paket abgerufen wird und dann auf den Namen der Schriftart und die gewünschten Optionen verwiesen wird.

Hier sind einige Optionen:

• Google Fonts Webpack Plugin
• Google-Schriftarten offline
• Google Fonts
• Holen Sie sich Google Fonts

Weiterführende Literatur: 

• Wie kann ich Material-Icons offline hosten?
• Offline-Materialsymbole und Roboto-Schriftart in der Electron-App verwenden