Favicon generator for Grunt

Generate and distribute favicons as part of your Grunt task runner setup.

Grunt task runner

Generate your favicon package first, then follow the steps below to integrate with Grunt.

Installation steps

1
Download and extract favicons to a source directory in your repo.
2
Configure copy task targets in Gruntfile.js pointing to your build output.
3
Add the copy:favicons task to your default or build registered task.
4
Run grunt build and confirm favicon files appear in the output folder.
5
Deploy the build folder including all favicon assets.

Code & configuration

Copy and adapt for your Grunt project

module.exports = function (grunt) {
  grunt.initConfig({
    copy: {
      favicons: {
        files: [
          { expand: true, cwd: "src/favicons/", src: "**", dest: "dist/" }
        ],
      },
    },
  });

  grunt.loadNpmTasks("grunt-contrib-copy");
  grunt.registerTask("build", ["copy:favicons" /* , other tasks */]);
};

Pro tips

grunt-contrib-copy is the standard plugin for static asset copying.
Run favicon copy after clean but before htmlmin to avoid broken references.

Files to deploy

favicon.ico

favicon.svg

favicon-96x96.png

apple-touch-icon.png

android-chrome-192x192.png

android-chrome-512x512.png

site.webmanifest