svg-app-icon

    1.1.0 • Public • Published

    svg app icon

    🎨 Create high-quality desktop app icons for Windows, MacOS, and Linux using an SVG source

    travis npm-downloads npm-version dm-david

    📥 Install

    npm install svg-app-icon

    👨‍💻 API

    const { promises: fs } = require('fs');
    const icons = require('svg-app-icon');
     
    (async () => {
      const svg = await fs.readFile('my-icon.svg');
     
      await icons(svg, {
        destination: './my-output-directory'
      });
    })();

    icons(svg, options)Promise

    The arguments for this method are:

    • svg String|Buffer - the SVG that you'd like to use as the icon
    • [options] Object - the options, everything is optional
      • [destination = 'icons'] String - the directory to output all icons to. If this direcotry doesn't exist, it will be created
      • [icns = true] Boolean - whether to generate an ICNS icon for MacOS
      • [ico = true] Boolean - whether to generate an ICO icon for Windows
      • [png = true] Boolean - whether to generate all PNG icon sizes for Linux
      • [svg = true] Boolean - whether to generate output the original SVG to the output destination
      • [pngSizes = [32, 256, 512]] Array<Integer> - the sizes to output for PNG icons, in case you need any additional sizes

    This promise resolves with undefined.

    💻 CLI

    You can also generate icons from the command line, so you don't have to write anything.

    npx svg-app-icon < input.svg

    Here are all the options (spoiler: they are the same as the API):

    Usage:
      svg-app-icon [options] < input.svg
    
    Options:
      --help             Show help
      --version          Show the version
      --destination, -d  Directory to output icons    [string]   [default: icons]
      --include, -i      Which icons to create        [string[]] [default: icns, ico, png, svg]
      --png-size, -s     What size png images create  [number[]] [default: 32, 256, 512]
    
    Note: all array arguments can be defined more than once
    
    Examples:
      svg-app-icon < input.svg
      svg-app-icon --include icns --include ico < input.svg
      cat input.svg | svg-app-icon --destination build/assets
    

    🤷‍♀️ But Why?

    There are very many tools to help you generate desktop app icons. They all, however, take one large PNG file as input and scale it down to generate all the necessary sizes. However, I have two problems:

    • I generate all my icons as SVG and would prefer not to manually pre-process them. I just want to check out the repo and have everyhting else automated.
    • I noticed that all the PNG-scaling solutions end up creating poor quality PNG images, especially for the smaller sizes. This results in icons that look bad.

    Since I use SVG, I actually don't need to scale PNG images. I can arbitrarily generate images of any size from the initial SVG. It just so happens that there are many solutions for that as well. However, for the most part, all have tradeoffs and quality issues as well. This module uses svg-render in order to create high-quality PNGs at any size. You can even use responsive PNGs, to render customized and optimized icons for every size. Try it, it's fun! 🎉

    Install

    npm i svg-app-icon

    DownloadsWeekly Downloads

    32

    Version

    1.1.0

    License

    ISC

    Unpacked Size

    9.32 kB

    Total Files

    5

    Last publish

    Collaborators

    • kirilv