Git Product home page Git Product logo

icon-font-buildr's Introduction

Icon Font Buildr

Build custom icon fonts, it supports remote and local icons sources.

Install

npm install --global icon-font-buildr # If you want to use the CLI
npm install --save icon-font-buildr # If you want to use the API

Usage

CLI

CLI

icon-font-buildr --config my_icon_font.json
icon-font-buildr # The `--config` option can be omitted if your configuration file is called `icon_font.json`

API

const path = require ( 'path' );
const IconFontBuildr = require ( 'icon-font-buildr' );

async function build () {

  const builder = new IconFontBuildr ({
    sources: [ // Where to get the icons, both remote and local sources are supported. `[icon]` will be replace with the name of your icon
      path.join ( __dirname, 'icons', '[icon].svg' ),
      'https://fonts.gstatic.com/s/i/materialicons/[icon]/v5/24px.svg',
      'https://fonts.gstatic.com/s/i/materialicons/[icon]/v4/24px.svg',
      'https://fonts.gstatic.com/s/i/materialicons/[icon]/v3/24px.svg',
      'https://raw.githubusercontent.com/Templarian/MaterialDesign/master/svg/[icon].svg'
    ],
    icons: [ // Icons to use/download
      'backup',
      'bug_report',
      'amazon',
      { // Advanced way to define an icon
        icon: 'android-debug-bridge',
        name: 'android debug icon', // Custom icon name
        codepoints: ['\ue042', '\ue064'], // Custom codepoints
        ligatures: ['debug', 'debug_alt'] // Custom ligatures
      }
    ],
    output: {
      // codepoints: true, // Enable support for codepoints
      // ligatures: false, // Disable support for ligatures
      // icons: path.join ( __dirname, 'builder-icons' ), // Where to save the icons, if not provided they won't be stored permanently
      fonts: path.join ( __dirname, 'builder-fonts' ), // Where to save the fonts
      fontName: 'MaterialDesign', // The name of the font to generate
      formats: [ // Font formats to output
        'eot',
        'ttf',
        'woff',
        'woff2'
      ]
    }
  });

  await builder.build ();

  const codepoints = builder.getIconsCodepoints (); // Get a map of icon names to codepoints, useful for generating HTML/CSS/SCSS etc.
  const ligatures = builder.getIconsLigatures (); // Get a map of icon names to ligatures, useful for generating HTML/CSS/SCSS etc.

}

build ();

License

MIT © Fabio Spampinato

icon-font-buildr's People

Contributors

fabiospampinato avatar cactysman avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.