A utility to download google webfonts to your local machine
JavaScript
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.eslintrc
.gitignore
.travis.yml
LICENSE
README.md
cli.js
cssGenerator.js
cssParser.js
fontDownloader.js
index.js
package.json

README.md

Google WebFont Downloader

NPM version

goog-webfont-dl is a Google WebFont utility to download webfont files to your local machine. It attempts to retreieve WOFF, TTF, EOT, and SVG file formats using custom user-agent strings. It will then output a CSS3 snippet that you can use directly in your project.

Usage

Usage: goog-webfont-dl [options] <fontname>

  Options:

    -h, --help                     output usage information
    -V, --version                  output the version number
    -t, --ttf                      Download TTF format
    -e, --eot                      Download EOT format
    -w, --woff                     Download WOFF format
    -W, --woff2                    Download WOFF2 format
    -s, --svg                      Download SVG format
    -a, --all                      Download all formats
    -f, --font [fontname]          Name of font
    -d, --destination [directory]  Save font in directory [default: <fontname>/]
    -o, --out [csspath]            CSS output file [use - for stdout. default: <fontname>.css]
    -p, --prefix [prefix]          Prefix to use in CSS output [default: ../fonts/<fontname>/]
    -u, --subset [string]          Subset string [e.g. latin,cyrillic]
    -y, --styles [string]          Style string [e.g. 300,400,300italic,400italic]
    -P, --proxy [string]           Proxy url [e.g. http://www.myproxy.com/]

Install as global command line utility

npm install -g goog-webfont-dl

Library

This package is compatible with Node 0.12 and above.

const downloader = require('goog-webfont-dl')
// or
import downloader from 'goog-webfont-dl'

const css = downloader('Some Font name')
// or
const css = downloader({
  // required:
  font: 'Some Font name',
  // defaults:
  formats:     downloader.formats, // Font formats.
  destination: font,               // Save font here
  out:         null, // = return   // CSS file. Use '-' for stdout, and nothing to return the CSS code
  prefix:      `../fonts/${font}`, // Prefix to use in CSS output
  subset:      null, // = none     // Subset string/array, e.g. 'latin,cyrillic'
  styles:      downloader.styles,  // Style string/array, e.g. '300,400,300italic,400italic'
  proxy:       null, // = none     // Proxy url, e.g. 'https://myproxy.com'
})

Since Array.prototype.toString works by joining array elements with commas, subset or styles can be specified as array as well.

Example

goog-webfont-dl -a Lato

Output:

Downloading webfont formats: “ttf,eot,woff,woff2,svg” to folder “Lato”
http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic
CSS output was successfully written to “Lato.css”

$ ls -1 ./Lato
Lato-Black-Italic.ttf
Lato-Black-Italic.woff
Lato-Black-Italic.woff2
Lato-Black.ttf
Lato-Black.woff
Lato-Black.woff2
Lato-Bold-Italic.ttf
Lato-Bold-Italic.woff
Lato-Bold-Italic.woff2
Lato-Bold.ttf
Lato-Bold.woff
Lato-Bold.woff2
Lato-Hairline-Italic.ttf
Lato-Hairline-Italic.woff
Lato-Hairline-Italic.woff2
Lato-Hairline.ttf
Lato-Hairline.woff
Lato-Hairline.woff2
Lato-Italic.ttf
Lato-Italic.woff
Lato-Italic.woff2
Lato-Light-Italic.ttf
Lato-Light-Italic.woff
Lato-Light-Italic.woff2
Lato-Light.ttf
Lato-Light.woff
Lato-Light.woff2
Lato-Regular.eot
Lato-Regular.svg
Lato-Regular.ttf
Lato-Regular.woff
Lato-Regular.woff2

Lato.css

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 100;
  src: local('Lato Hairline'), local('Lato-Hairline'), url(../fonts/Lato/Lato-Hairline.woff2) format('woff2'), url(../fonts/Lato/Lato-Hairline.ttf) format('truetype'), url(../fonts/Lato/Lato-Hairline.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local('Lato Light'), local('Lato-Light'), url(../fonts/Lato/Lato-Light.woff2) format('woff2'), url(../fonts/Lato/Lato-Light.ttf) format('truetype'), url(../fonts/Lato/Lato-Light.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/Lato/Lato-Regular.eot);
  src: local('Lato Regular'), local('Lato-Regular'), local('Lato'), url(../fonts/Lato/Lato-Regular.woff2) format('woff2'), url(../fonts/Lato/Lato-Regular.ttf) format('truetype'), url(../fonts/Lato/Lato-Regular.woff) format('woff'), url(../fonts/Lato/Lato-Regular.eot?#iefix) format('embedded-opentype'), url(../fonts/Lato/Lato-Regular.svg#Lato) format('svg');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(../fonts/Lato/Lato-Bold.woff2) format('woff2'), url(../fonts/Lato/Lato-Bold.ttf) format('truetype'), url(../fonts/Lato/Lato-Bold.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: local('Lato Black'), local('Lato-Black'), url(../fonts/Lato/Lato-Black.woff2) format('woff2'), url(../fonts/Lato/Lato-Black.ttf) format('truetype'), url(../fonts/Lato/Lato-Black.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 100;
  src: local('Lato Hairline Italic'), local('Lato-HairlineItalic'), url(../fonts/Lato/Lato-Hairline-Italic.woff2) format('woff2'), url(../fonts/Lato/Lato-Hairline-Italic.ttf) format('truetype'), url(../fonts/Lato/Lato-Hairline-Italic.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  src: local('Lato Light Italic'), local('Lato-LightItalic'), url(../fonts/Lato/Lato-Light-Italic.woff2) format('woff2'), url(../fonts/Lato/Lato-Light-Italic.ttf) format('truetype'), url(../fonts/Lato/Lato-Light-Italic.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(../fonts/Lato/Lato-Italic.woff2) format('woff2'), url(../fonts/Lato/Lato-Italic.ttf) format('truetype'), url(../fonts/Lato/Lato-Italic.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(../fonts/Lato/Lato-Bold-Italic.woff2) format('woff2'), url(../fonts/Lato/Lato-Bold-Italic.ttf) format('truetype'), url(../fonts/Lato/Lato-Bold-Italic.woff) format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 900;
  src: local('Lato Black Italic'), local('Lato-BlackItalic'), url(../fonts/Lato/Lato-Black-Italic.woff2) format('woff2'), url(../fonts/Lato/Lato-Black-Italic.ttf) format('truetype'), url(../fonts/Lato/Lato-Black-Italic.woff) format('woff');
}

Font Name:

If the fontname uses spaces, surround the argument with quotes (or use + instead of spaces)

goog-webfont-dl -a -f "Source Sans Pro" -y 300,400,600,700,300italic,400italic,600italic

License

MIT License