Back to Plugins
Tokens to Tailwind CSS
Generate utility classes for Tailwind CSS from local style of Figma.
tailwindcsscolorstylescode-generators
Plugin Preview
About this plugin
This plugin generates utility classes for Tailwind CSS from design tokens set in the local style of Figma.
Instructions
- Create 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 colours
Generates the primitive styles referenced by the semantic style as CSS variables.
・Classify by keys
Classify 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 | 155 installs, 39 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.