seanchas116 / figma-to-tailwind

Figma plugin to convert layers to Tailwind HTML/JSX (utilizing JIT and custom configs)

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

figma-to-tailwind

Figma plugin to convert layers to Tailwind HTML/JSX (utilizing JIT and custom configs)

Development

Setup and build/watch

npm install
npm run dev

Open in Figma

  • Run npm run dev
  • Open Figma
  • Click Menu > Plugins > Development > Import plugin from manifest...
    • Select figma-to-tailwind/manifest.json
  • Click Menu > Plugins > Development > Figma to Tailwind

To-do list

  • JIT-only output
  • Custom configs
  • Un-JIT values
  • Generate multiple spans for text node
  • More CSS properties
    • Shadows
    • Gradients
    • Text transform
    • etc
  • Publish to Figma Community

About

Figma plugin to convert layers to Tailwind HTML/JSX (utilizing JIT and custom configs)

License:MIT License


Languages

Language:TypeScript 95.9%Language:JavaScript 3.0%Language:HTML 1.0%Language:CSS 0.2%