Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub


Current npm package version Downloads per month on npm.

Add external custom css files to your generated html pages.


npm install gatsby-plugin-external-css


yarn add gatsby-plugin-external-css


This plugin lets you add a custom css file in your builded public index.html. You probably don’t need this as it’s for very specific usage.

In my case, I’m generating different gatsby projects based on a config, and I’m providing a custom way to give a css file out of the src folder scope.

Add the following plugin to your gatsby-config.js


// gatsby-config.js
module.exports = {
  plugins: [
      resolve: 'gatsby-plugin-external-css',
      options: {
        source: 'full/local/path.css',

Be sure that the file exists.

The file will be copied into the final public file with a custom cache busting. The css file will be appended at the last of the meta.

© 2023 Gatsby, Inc.