Back to Plugins
Tokens to Tailwind CSS

Tokens to Tailwind CSS

Generate utility classes for Tailwind CSS from local style of Figma.

tailwindcsscolorstylescode-generators

Plugin Preview

Tokens to Tailwind CSS 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

Version2
CreatedMarch 28, 2023
Last UpdatedMarch 30, 2023
CategorySoftware development
Creatorkoyama shigehito
Stats186 installs, 47 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/index.html
  • main:dist/code.js
  • Editor Types:
    figma