@gizeta/icon-gen v2.1.1
npm-icon-gen
Generate an icon files from the SVG or PNG files.
Support formats
Supported the output format of the icon are following.
| Platform | Icon | 
|---|---|
| Windows | app.ico or specified name. | 
| macOS | app.icns or specified name. | 
| Favicon | favicon.ico and favicon-XX.png. | 
Installation
$ npm install icon-genUsage
SVG and PNG are automatically selected from the input path. If the path indicates a file SVG, if it is a directory it will be a PNG folder.
SVG
SVG files are rendering to PNG file in svg2png. Rendering files is output to a temporary directory of the each OS.
Rendering of svg2png is run by phantomjs. Please use the PNG directory If the rendering quality there is a problem.
const icongen = require('icon-gen')
icongen('./sample.svg', './icons', { report: true })
  .then((results) => {
    console.log(results)
  })
  .catch((err) => {
    console.error(err)
  })PNG
Generate an icon files from the directory of PNG files.
const icongen = require('icon-gen');
icongen('./images', './icons', { report: true })
.then((results) => {
  console.log(results);
} )
.catch((err) => {
  console.error(err);
});Required PNG files is below. Favicon outputs both the ICO and PNG files (see: audreyr/favicon-cheat-sheet).
| Name | Size | ICO | ICNS | Fav ICO | Fav PNG | 
|---|---|---|---|---|---|
| 16.png | 16x16 | ✔ | ✔ | ✔ | |
| 24.png | 24x24 | ✔ | ✔ | ||
| 32.png | 32x32 | ✔ | ✔ | ✔ | ✔ | 
| 48.png | 48x48 | ✔ | ✔ | ||
| 57.png | 57x57 | ✔ | |||
| 64.png | 64x64 | ✔ | ✔ | ✔ | |
| 72.png | 72x72 | ✔ | |||
| 96.png | 96x96 | ✔ | |||
| 120.png | 120x120 | ✔ | |||
| 128.png | 128x128 | ✔ | ✔ | ✔ | |
| 144.png | 144x144 | ✔ | |||
| 152.png | 152x152 | ✔ | |||
| 195.png | 195x195 | ✔ | |||
| 228.png | 228x228 | ✔ | |||
| 256.png | 256x256 | ✔ | ✔ | ||
| 512.png | 512x512 | ✔ | |||
| 1024.png | 1024x1024 | ✔ | 
To make it a special size configuration, please specify with ico,icns and favicon options.
Node API
icongen
icongen is promisify function.
icongen(src, dest[, options])
| Name | Type | Description | 
|---|---|---|
| src | String | Path of the SVG file or PNG files directory that becomes the source. | 
| dest | String | Destination directory path. | 
| options | Object | see: Options. | 
Options:
const options = {
  report: true,
  ico: {
    name: 'app',
    sizes: [16, 24, 32, 48, 64, 128, 256]
  },
  icns: {
    name: 'app',
    sizes: [16, 32, 64, 128, 256, 512, 1024]
  },
  favicon: {
    name: 'favicon-',
    pngSizes: [32, 57, 72, 96, 120, 128, 144, 152, 195, 228],
    icoSizes: [16, 24, 32, 48, 64]
  }
}If all image options (ico,icns, favicon) are omitted, all images are output with their default settings.
// Output an all images with default settings
const options = {
  report: true
}If individual image option is omitted, default setting is used. If there is a format that you do not want to output, specify others and omit that image.
// Without ICNS
const options = {
  report: true,
  ico: {}
  favicon: {}
}| Name | Type | Description | 
|---|---|---|
| report | Boolean | Display the process reports. Default is false, disable a report. | 
| ico | Object | Output setting of ICO file. | 
| icns | Object | Output setting of ICNS file. | 
| favicon | Object | Output setting of Favicon file (PNG and ICO). | 
ico, icns
| Name | Type | Default | Description | 
|---|---|---|---|
| name | String | app | Name of an output file. | 
| sizes | Number[] | [Defaults...] | Structure of an image sizes. | 
favicon
| Name | Type | Default | Description | 
|---|---|---|---|
| name | String | favicon- | Prefix of an output PNG files. Start with the alphabet, can use - and _. This option is for PNG. The name of the ICO file is always favicon.ico. | 
| pngSizes | Number[] | [Defaults...] | Size structure of PNG files to output. | 
| icoSizes | Number[] | [Defaults...] | Structure of an image sizes for ICO. | 
CLI
Usage:  icon-gen [options]
Generate an icon from the SVG or PNG file.
If "--ico", "--icns", "--favicon" is not specified, everything is output in the standard setting.
Options:
  -i, --input <Path>           Path of the SVG file or PNG file directory.
  -o, --output <Path>          Path of the output directory.
  -r, --report                 Display the process reports, default is disable.
  --ico                        Output ICO file with default settings, option is "--ico-*".
  --ico-name <Name>            ICO file name to output.
  --ico-sizes [Sizes]          PNG size list to structure ICO file
  --icns                       Output ICNS file with default settings, option is "--icns-*".
  --icns-name <Name>           ICO file name to output.
  --icns-sizes [Sizes]         PNG size list to structure ICNS file
  --favicon                    Output Favicon files with default settings, option is "--favicon-*".
  --favicon-name <Name>        prefix of the PNG file. Start with the alphabet, can use "-" and "_"
  --favicon-png-sizes [Sizes]  Sizes of the Favicon PNG files
  --favicon-ico-sizes [Sizes]  PNG size list to structure Favicon ICO file
  -v, --version                output the version number
  -h, --help                   output usage information
Examples:
  $ icon-gen -i sample.svg -o ./dist -r
  $ icon-gen -i ./images -o ./dist -r
  $ icon-gen -i sample.svg -o ./dist --ico --icns
  $ icon-gen -i sample.svg -o ./dist --ico --ico-name sample --ico-sizes 16,32
  $ icon-gen -i sample.svg -o ./dist --icns --icns-name sample --icns-sizes 16,32
  $ icon-gen -i sample.svg -o ./dist --favicon --favicon-name=favicon-  --favicon-png-sizes 16,32,128 --favicon-ico-sizes 16,32
See also:
  https://github.com/akabekobeko/npm-icon-gen