Tokens to Tailwind CSS
Generate utility classes for Tailwind CSS from local style of Figma.
Plugin Preview
About this plugin
This plugin generates utility classes for Tailwind CSS from design tokens set in the local style of Figma.InstructionsCreate a local styles.Run this plugin.Select some options and press generate button.Copy and paste the generated code into the Tailwind CSS configuration file.*Currently only colour styles are supported.Options・Primitive coloursGenerates the primitive styles referenced by the semantic style as CSS variables.・Classify by keysClassify by key if a special name is used for the first level of the style name.Find out more:https://github.com/K-shigehito/figma-tokens-to-tailwind#readme
Plugin Details
| Version | 2 |
|---|---|
| Created | March 28, 2023 |
| Last Updated | March 30, 2023 |
| Category | Software development |
| Creator | koyama shigehito |
| Stats | 193 installs, 49 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/index.html
- main:dist/code.js
- Editor Types:figma
More Like This
Discover other plugins in the Software development category.
Builder.io - Figma to Code & AI Apps (React, Vue, Tailwind, etc)
Export designs to clean, responsive code or turn Figma screens into AI apps and prototypes.
Code Snippet Editor
Translate component variants, properties, and more into dynamic code snippets for your design system
GitHub
Connect Design to Code