ben-rogerson / gatsby-recipe-styled-components-twin

A Gatsby recipe for adding 💅 Styled Components and 🦹‍♂️ Twin

Gatsby Recipe Styled Components Twin

🦹‍♂️ Twin lets you style with Tailwind classes in jsx.

Twin works best with css-in-js libraries like 👩‍🎤 emotion and 💅 styled-components.

Minimum requirements

• Node version 12 +
• Gatsby version 2.20.23 +

Getting started

Create a new Gatsby project based on the Gatsby starter:

gatsby new gatsby-styled-components-twin https://github.com/gatsbyjs/gatsby-starter-hello-world
# then
cd gatsby-styled-components-twin

Start the Gatsby recipe:

gatsby recipes https://raw.githubusercontent.com/ben-rogerson/gatsby-recipe-styled-components-twin/master/main.mdx

Start your development server

npm run start
# or
yarn start

Then view the demo at /twin-sc-example