Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub

A Gatsby theme to easily use tailwindcss.


This theme installs:


yarn add @jambaree/gatsby-theme-tailwindcss


Add the newly generated globals.css file to your gatsby-browser

import "./src/styles/globals.css"

Theme options

This theme is using gatsby-plugin-postcss under the hood, so you can pass in any options you would to the actual postcss plugin (postCssPlugins and cssLoaderOptions)

NOTE: using a postcss.config.js file is not supported, you have to use the options: {} object of the theme.
Key Default value Description
postCssPlugins [require(“tailwindcss”)] postcss-plugins to load
cssLoaderOptions {} postcss css loader options
emotionOptions {} emotion babel-plugin-emotion options

With autoprefixer

// gatsby-config.js
module.exports = {
  plugins: [
      resolve: `gatsby-theme-tailwindcss`,
      options: {
        postCssPlugins: [require("autoprefixer")],
© 2023 Gatsby, Inc.