Guide to Icon Generation and Advanced API Usage with icon-gen

Welcome to our comprehensive guide on icon-gen, a powerful tool for generating icons and image assets for your projects. In this article, we will explore the introduction to icon-gen and delve into a wide range of useful API explanations with code snippets to help you make the most of this tool.

Introduction to icon-gen

icon-gen is a highly versatile tool for generating icons in various formats essential for different platforms such as iOS, Android, Windows, and the web. It can automate the process of creating required sizes and resolutions, ensuring every image is pixel-perfect. Whether you’re a developer or a designer, icon-gen can streamline your workflow significantly.

Basic Usage

To get started with icon-gen, you can install it using npm:

  npm install icon-gen -g

After installation, you can generate icons from a single source image using the following command:

  icon-gen -i ./source.png -o ./output

Generating iOS Icons

Creating iOS icons requires specific sizes. icon-gen can help automate this process:

  icon-gen -i ./source.png -o ./output --type ios

Generating Android Icons

Similar to iOS, Android apps require multiple image resolutions. Use icon-gen to generate all necessary Android icons:

  icon-gen -i ./source.png -o ./output --type android

Generating Favicon

Favicons are essential for web applications. Generate all necessary favicon sizes with icon-gen:

  icon-gen -i ./source.png -o ./output --type favicon

Generating Windows Icons

Windows applications require specific icon formats. Here’s how to generate them with icon-gen:

  icon-gen -i ./source.png -o ./output --type ico

API Usage Examples

icon-gen can also be used programmatically in your Node.js applications. Below are several examples demonstrating its usage:

Basic API Usage

  const icongen = require('icon-gen');

  icongen('./source.png', './output', { report: true })
    .then(results => {
      console.log(results);
    })
    .catch(err => {
      console.error(err);
    });

Generating Specific Icon Types

Generate only iOS icons programmatically:

  icongen('./source.png', './output', { type: 'ios' })
    .then(results => {
      console.log('iOS icons generated:', results);
    })
    .catch(err => {
      console.error('Error:', err);
    });

Generating Favicon

Create favicons for web use:

  icongen('./source.png', './output', { type: 'favicon' })
    .then(results => {
      console.log('Favicons generated:', results);
    })
    .catch(err => {
      console.error('Error:', err);
    });

Handling Errors

Handling errors is crucial when working with file operations. icon-gen provides error handling capabilities:

  icongen('./source.png', './output')
    .then(results => {
      console.log('Icons generated successfully');
    })
    .catch(err => {
      console.error('An error occurred during generation:', err);
    });

Example Application

Let’s create a simple Node.js application to generate iOS and Android icons simultaneously:

  const icongen = require('icon-gen');

  async function generateIcons() {
    try {
      const iosResults = await icongen('./source.png', './ios-output', { type: 'ios' });
      console.log('iOS icons:', iosResults);

      const androidResults = await icongen('./source.png', './android-output', { type: 'android' });
      console.log('Android icons:', androidResults);

    } catch (err) {
      console.error('Error generating icons:', err);
    }
  }

  generateIcons();

In this example, we used async/await to handle asynchronous operations neatly. This will generate all necessary iOS and Android icons and log the results to the console.

icon-gen is a robust tool that simplifies the process of generating various icon formats needed for different platforms. By mastering its CLI commands and API usage, you can ensure all your projects maintain high-quality visual assets.

Hash: 77c811db436f864c4f53220d2a532ff468cb75c486ecfc80c614800d242a029b