https://github.com/samuelgoddard/gatsby-tailwind-motion

An opinionated starter for Gatsby v2 with Tailwind and Framer Motion
https://github.com/samuelgoddard/gatsby-tailwind-motion

framer gatsby motion postcss tailwind

Last synced: about 1 year ago
JSON representation

An opinionated starter for Gatsby v2 with Tailwind and Framer Motion

• Host: GitHub
• URL: https://github.com/samuelgoddard/gatsby-tailwind-motion
• Owner: samuelgoddard
• License: mit
• Created: 2019-10-09T16:10:17.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2023-01-04T18:56:15.000Z (over 3 years ago)
• Last Synced: 2025-04-05T02:22:04.805Z (about 1 year ago)
• Topics: framer, gatsby, motion, postcss, tailwind
• Language: JavaScript
• Homepage: https://gatsby-tailwind-motion.netlify.com/
• Size: 7.67 MB
• Stars: 22
• Watchers: 2
• Forks: 3
• Open Issues: 16
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
⚠️ This is no longer maintained in favour of my [Next Tailwind Motion](https://github.com/samuelgoddard/next-tailwind-motion) boilerplate ⚠️



  Gatsby x Tailwind x Framer Motion Boilerplate



[![Netlify Status](https://api.netlify.com/api/v1/badges/7e52dbac-aec4-4a56-864f-e33649fadc9b/deploy-status)](https://app.netlify.com/sites/gatsby-tailwind-motion/deploys)

Gatsby + Tailwind + Framer Motion powered boilerplate

[https://gatsby-tailwind-motion.netlify.com](https://gatsby-tailwind-motion.netlify.com)

## 🚀 Quick start

1.  **Clone the repo**

    ```sh

    git clone https://github.com/samuelgoddard/gatsby-tailwind-motion

    ```

1.  **Start developing.**

    Navigate into your new site’s directory and install the local dependencies.

    ```sh

    yarn

    ```

    Start developing locally (with gatsby-cli).

    ```sh

    cd gatsby-tailwind-motion/

    gatsby develop

    ```

1.  **Open the source code and start editing!**

    Your site is now running at `http://localhost:8000`!

    _Note: You'll also see a second link: _`http://localhost:8000/___graphql`_. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the [Gatsby tutorial](https://www.gatsbyjs.org/tutorial/part-five/#introducing-graphiql)._

## 📄 Docs

- [Gatsby](https://www.gatsbyjs.org/docs/)

- [TailwindCSS](https://tailwindcss.com/)

- [Framer Motion](https://www.framer.com/motion/)

- [PostCSS](https://postcss.org/)