Skip to content
Favicon Gatsby plugin
Branch: master
Clone or download
Type Name Latest commit message Commit time
Failed to load latest commit information.
.editorconfig Add favicon webpack plugin Aug 8, 2017
.gitignore Remove dependencies on Babel and global update Jul 23, 2018
.npmignore Update .npmignore Nov 28, 2017
LICENSE Initial commit Aug 8, 2017 Updated Apr 3, 2019
gatsby-node.js Remove Gatsby v1 workaround (was breaking Gatsby v2 build) Sep 4, 2018
gatsby-ssr.js Add React key property to dom nodes Aug 21, 2018
package.json Upgrade version to 3.1.6 Apr 3, 2019


Generates all favicons for Web, Android, iOS, ...


yarn add gatsby-plugin-favicon


npm install --save gatsby-plugin-favicon

How to use

  1. Include the plugin in your gatsby-config.js file.
  2. Add a favicon.png file in your src folder. The recommended size for the file is: 1500x1500px.
// in gatsby-config.js
plugins: [


Here is a full list of options with their default values you can use to configure this plugin.

// in gatsby-config.js
plugins: [
    resolve: `gatsby-plugin-favicon`,
    options: {
      logo: "./src/favicon.png",

      // WebApp Manifest Configuration
      appName: null, // Inferred with your package.json
      appDescription: null,
      developerName: null,
      developerURL: null,
      dir: 'auto',
      lang: 'en-US',
      background: '#fff',
      theme_color: '#fff',
      display: 'standalone',
      orientation: 'any',
      start_url: '/?homescreen=1',
      version: '1.0',

      icons: {
        android: true,
        appleIcon: true,
        appleStartup: true,
        coast: false,
        favicons: true,
        firefox: true,
        yandex: false,
        windows: false

Gatsby v1

Starting from v3, this plugin is not compatible anymore with Gatsby v1, you should stick to the version 2.1.1 of this plugin with Gatsby v1.

You can’t perform that action at this time.