Automatically shows the nprogress indicator when a page is delayed in loading (which Gatsby considers as one second after clicking on a link).


npm install gatsby-plugin-nprogress

How to use

// In your gatsby-config.js
plugins: [
    resolve: `gatsby-plugin-nprogress`,
    options: {
      // Setting a color is optional.
      color: `tomato`,
      // Disable the loading spinner.
      showSpinner: false,

In addition to color – a configuration option specific to gatsby-plugin-nprogress that saves some time customizing the nprogress CSS to match your site colors – you may pass all available nprogress configuration options.