Skip to content

christian-reichart/tailwindcss-figma-plugin

 
 

Repository files navigation

Tailwind CSS Figma Plugin

Figma Plugin CI GitHub license PRs Welcome

All Contributors

Making your life with Tailwind CSS and Figma easier.

plugin banner

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!

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 89.2%
  • JavaScript 8.9%
  • Other 1.9%