Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub


A Gatsby plugin to use styled-jsx with PostCSS.


With Yarn:

yarn add gatsby-plugin-styled-jsx-postcss

Or with npm:

npm install --save gatsby-plugin-styled-jsx-postcss


// In your gatsby-config.js
plugins: [


This plugin will also watch CSS files and refresh your browser on change if running in develop mode. This is because if you’re importing other CSS files in your <style> tags, the browser will not refresh on its own. To disable this set a watchCss option to false.

Adding PostCSS plugins

This plugin uses the postcss-load-plugins, so you can import PostCSS plugins with any of the methods mentioned in their documentation.

© 2023 Gatsby, Inc.