Awesome Open Source
Awesome Open Source


Generate development-ready theme JSON files from Figma Styles

npm i figma-theme

Getting Started

  1. Install figma-theme as a dev dependency in your project
  2. Get a personal access token for the Figma API
  3. Create a .env file with your access token
  • FIGMA_TOKEN=<personal-access-token>
  • Alternatively add an environment variable for FIGMA_TOKEN
  1. Add an npm run script: figma-theme <figma-file-id>
  2. Run the script to create a theme.json file based on Figma Styles


Options can be passed as CLI flags or included in a figma-theme object in your package.json

  • --out-dir: output directory (default current working directory)
  • --metadata: include additional metadata from the Figma API

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Javascript (1,538,942
Theme (5,991
Design System (984
Token (948
Style (695
Css In Js (569
Figma (509
Related Projects