Web Font Converter
Convert font files to different formats. Primarily used for creating woff/woff2 files for use on the web.
Table of Contents
Install
Install with npm:
npm install --save-dev @hayes0724/web-font-converterInstall with yarn:
yarn add @hayes0724/web-font-converter --devFormats
- ttf -> woff
- ttf -> woff2
- svg -> ttf
- svg -> ttf -> woff
- svg -> ttf -> woff2
- otf -> svg
- otf -> svg -> ttf
- otf -> svg -> ttf -> woff
- otf -> svg -> ttf -> woff2
API
Convert All Fonts
Converts all fonts that match input formats to the specified output format
const { convertAllFonts } = require('@hayes0724/web-font-converter')
// This will convert all ttf fonts to both woff and woff2
convertAllFonts({
pathIn: './fonts',
pathOut: './output',
outputFormats: ['.woff', '.woff2'],
inputFormats: ['.ttf'],
debug: false
})
// This will convert all ttf and svg fonts to both woff and woff2
convertAllFonts({
pathIn: './fonts',
pathOut: './output',
outputFormats: ['.woff', '.woff2'],
inputFormats: ['.ttf', '.svg'],
debug: false
})
// If you provide no options it will run with the defaults below
convertFont({})| Option | Description | Default |
|---|---|---|
| pathIn | {String} Path to font folder | current directory |
| pathOut | {String} Path to store converted fonts | current directory |
| outputFormats | {Array} Font types to convert to | ['.woff', '.woff2'] |
| inputFormats | {Array} Font type to convert from | ['.ttf'] |
| debug | {Boolean} extra output | false |
Input Formats: otf, svg, ttf
Output Formats: svg, ttf, woff, woff2
Convert Font
Converts a single font, uses file extension to determine conversion.
const { convertFont } = require('@hayes0724/web-font-converter')
// This will convert the font from ttf to woff and place font in output folder
convertFont(`./fonts/input/Roboto-Regular.ttf`, `./fonts/output/Roboto-Regular.woff`)
// This will convert the font from svg to woff2 and place font in the same folder
convertFont(`./Roboto-Regular.svg`, `./Roboto-Regular.woff2`)Fonts
Convert a single font from one format to another. This is used by convertFont and convertAllFonts, it's useful for creating your own
scripts for processing.
const fonts = require('@hayes0724/web-font-converter/src/lib/fonts')
// fonts[inputKey].convert[outputKey](inputFile, outputFile)
fonts.ttf.convert.woff2('myfile.ttf', 'myfont.woff2')CLI
Converts a single font, uses file extension to determine conversion.
font-convert --pathIn='./fonts/Roboto-Regular.ttf' --pathOut='./fonts/Roboto-Regular.woff'| Option | Description |
|---|---|
--pathIn |
{String} Input font file |
--pathOut |
{String} Output font file |
Input Formats: otf, svg, ttf
Output Formats: svg, ttf, woff, woff2