Tailwind CSS Figma Plugin

Making your life with Tailwind CSS and Figma easier.

Usage

1. Generate a resolved TailwindCSS config (make sure dependencies are installed)

   $ cd yourtailwindproject/
   $ npx tailwind.json
   

2. Drag the generated tailwind.json in the plugin.

3. Done!

Setup

This Plugin will only work when running within Figma since it relies on its API.

Go to the Plugins tab and add this projects manifest.json. For more info read the Figma docs

1. Then, install your dependencies:

   $ yarn install
   

2. The config offers either a dev or build script

   $ yarn dev
   $ yarn build
   

Hot Reloading (macOS only)

Not the smoothest experience, but way better than needing to press a hotkey. In case you use the Figma Beta change App name in applescript.sh.

  $ brew install modd
  $ cd tailwindcss-figma-plugin/
  $ modd

License

MIT

Contributors ✨

Thanks goes to these wonderful people (emoji key):

KA95DEV 💻

Roberto Leinardi 🤔 💻

This project follows the all-contributors specification. Contributions of any kind welcome!